进入页面时候
plus.screen.lockOrientation('landscape-primary'); //锁定横屏
plus.navigator.setFullscreen(true); //隐藏状态栏(应用全屏:只能隐藏状态栏，标题栏和虚拟返回键都还可以显示)
plus.navigator.hideSystemNavigation()
uni.navigateTo({
url: `/pages/room/roomheng?flag=1&id=${item.id}&gen=${gen}&gameName=2`
})在nvue里面的代码
<template>
<view>
<view v-if="os==1" :style="{height:windowHeight+'px'}">
<CustomVideoView :src="roomDetailData?roomDetailData.liveAddress:''" :muteVoice="!showimg"
:aspectRatio="aspectRatio" :style="{height:windowHeight+'px'}" ref="customVideoView"
@init-callback="initCallback" @onSnapshotCallback="snapshotCallback">
</CustomVideoView>
</view>
<view v-else :style="{height:windowHeight+'px'}">
<xx-player class="ijkvideo" ref="ijkvideo" :style="{height:windowHeight+'px'}"
:url="roomDetailData.liveAddress" :muted="!showimg" :scalingMode="scalingMode"
@videoSizeChanged="videoSizeChanged" @captureVideoImageChanged="captureVideoImageChanged">
<!-- :fullscreen="fullScreen" -->
<!-- @videoSizeChanged="videoSizeChanged" -->
</xx-player>
</view>
<view class="main" :style="{width:windowWidth+'px',height:windowHeight+'px'}">
<!-- 顶部 -->
<view class="header">
<view class="left">
<view class="left-item" @click="navto">
<image class="left-icon" src="/static/img/jb.png"></image>
<text class="left-text">
{{user.coin?user.coin:0}}
</text>
<image class="left-icon" src="/static/img/jia.png"></image>
</view>
<view class="left-item" @click="navshowa()">
<image class="left-icon" src="/static/img/zs.png"></image>
<text class="left-text">
{{user.integral?user.integral:0}}
</text>
<image class="left-icon" src="/static/img/dh.png"></image>
</view>
</view>
<view class="mid">
<view class="user" v-for="(item, index) in seatListdata" :key="index">
<image v-if="item.status==2" :src="item.userAvatar?item.userAvatar:'../../static/user.png'"
class="user-icon" mode=""></image>
<view v-else class="user-icon">
<text class="user-icon">空</text>
</view>
<!-- <text class="user-p">{{ index + 1 }}P</text> -->
<image class="user-img" v-if="item.userLevelPic" :src="item.userLevelPic" mode=""></image>
<text v-else class="user-p">{{ index + 1 }}P</text>
</view>
</view>
<view class="right">
<text class="room-name"
v-if="roomDetailData">{{roomDetailData.roomName+roomDetailData.roomMultiple+"倍 "+roomDetailData.lessCoin+'币'}}</text>
<view v-if="spectatorUser.length>0" style="position: relative;height: 41px;margin: 6px;">
<view class="flex-row align-center clf fs28px">
<image v-for="(item,index) in spectatorUser" :key="index" v-if="index<3" :src="item"
class="looimage" :style="index>0?'margin-left: -5px;':''" mode="" />
<image src="../../static/user.png" v-if="spectatorUser.length==1 || spectatorUser.length==2"
style="margin-left: -5px;" class="looimage" mode=""></image>
<image src="../../static/user.png" v-if="spectatorUser.length==1" style="margin-left: -5px;"
class="looimage" mode=""></image>
</view>
<view class="looponeas">
<text class="txt1as">{{spectatorUser.length>99?"99+":spectatorUser.length}}人围观中</text>
</view>
</view>
<view v-else style="position: relative;height: 41px;margin: 0 6px;">
<view class="flex-row align-center clf fs28px">
<image src="../../static/user.png" class="looimage" mode=""></image>
<image src="../../static/user.png" style="margin-left: -5px;" class="looimage" mode="">
</image>
<image src="../../static/user.png" style="margin-left: -5px;" class="looimage" mode="">
</image>
</view>
<view class="looponeas">
<text class="txt1as">0人围观中</text>
</view>
</view>
<image class="tc" @click="back()" src="/static/room/tc.png"></image>
</view>
</view>
<!-- 工具栏 -->
<view class="tool-bar">
<image class="left-tool" :src="show3 ? '/static/room/sj.png':'/static/room/sjimg.png'"
@click="show3 = !show3"></image>
<view class="flex-row align-center">
<view class="foolr" @click="ccshow=true">
<image src="/static/room/jp.png" style="width: 21px;height: 12px;" mode=""></image>
</view>
<view class="right-tool" @click="show = !show;showTume = 60">
<text class="right-tool-text"> {{!show? '展开聊天':'收起聊天'}}</text>
<u-icon name="arrow-down" color="#ffffff" size="14"></u-icon>
</view>
</view>
</view>
<view class="order-item" v-if="num==4" style="position: fixed;left: 16px;top: 105px;">
<image class="order-img" src="../../static/room/zhong.png"></image>
<text class="order-text">{{sstme}}S</text>
</view>
<!-- 加倍 上分 -->
<view class="order-list" v-if="num==4">
<view class="order-item" @click="addsendType('append')" @touchstart="oNtouchstart('append')"
@touchend="oNtouchend('append')">
<image class="order-img"
:src="toucClass?toucClass.append?'../../static/roomes/jiab.png':'../../static/roomes/jia.png':'../../static/roomes/jia.png'">
</image>
<text class="order-text">加倍</text>
</view>
<view class="order-item" @click="addsendType('coin')" @touchstart="oNtouchstart('coin')"
@touchend="oNtouchend('coin')">
<image class="order-img"
:src="toucClass?toucClass.coin?'../../static/roomes/fengb.png':'../../static/roomes/feng.png':'../../static/roomes/feng.png'">
</image>
<text @ class="order-text">上分</text>
</view>
</view>
<view class="left-block" v-if="show3">
<view class="block" v-for="(itemc, indexc) in data" :key="indexc" @click="navtoclick(itemc.name)">
<image class="block-icon" :src="itemc.img"></image>
<text class="block-text">{{itemc.name}}</text>
</view>
</view>
<!-- 工具栏下拉 -->
<view class="tool">
<view style="flex-shrink: 0; width: 150px;"></view>
<view class="right-block" v-if="show">
<scroll-view @touchmove.stop style="width: 256px;height: 150px;" scroll-with-animation
:scroll-into-view="itemId" class="Scroll" scroll-y="true">
<!-- 不需要引入，可直接使用 -->
<mp-html :content="roomNotice"
container-style="color: #fff;font-size: 12px;width: 250px;padding:0 3px;" />
<view v-for="(item,index) in chatList" :key="index" :id="`item-${index}`"
style="word-break:break-all;width: 250px;padding: 0 3px;">
<text class="txt1">{{item.userName}}:</text><text class="txt2">{{item.content}}</text>
</view>
</scroll-view>
</view>
</view>
<!-- 底部 -->
<view class="footer" :style="{width:windowWidth+'px'}">
<view class="player" v-for="(itemc,indexc) in seatListdata" :key="indexc"
@click="numClick(itemc.id,itemc.status)" v-if="num==1">
<image class="player-img" v-if="itemc.status == 0" src="../../static/room/bannb.png"></image>
<image class="player-img" v-else src="../../static/room/btnann.png"></image>
<text class="player-text">{{ itemc.status==0 ? `${itemc.name}可上机` : `${itemc.name}游戏中` }}</text>
</view>
</view>
<view class="player-list" :style="{width:windowWidth+'px'}" v-if="num==2">
<view class="player">
<image class="player-img" src="../../static/room/bannb.png"></image>
<text @click="addseatId()" class="player-text">开始游戏</text>
</view>
</view>
<view class="player-list" :style="{width:windowWidth+'px'}" v-if="num==3">
<view class="player" style="width: 103px;" @click="addlineup()">
<image class="player-img" style="width: 103px;" src="../../static/room/buffg.png"></image>
<text class="player-text" style="width: 103px;text-align: center;">预约游戏：{{quNum?quNum:0}}</text>
</view>
</view>
<view class="player-list" :style="{width:windowWidth+'px'}" v-if="num==5">
<view class="player" style="width: 103px;" @click="addcancelLineup()">
<image class="player-img" style="width: 103px;" src="../../static/room/buury.png"></image>
<text class="player-text" style="width: 103px;text-align: center;">取消预约：{{quNum?quNum:0}}</text>
</view>
</view>
<text class="fubbloop" :style="{width:windowWidth+'px'}" v-if="num==3 || num==1 ||num==2">
围观时长剩余{{showTume}}s
</text>
<!-- 方向键 -->
<view class="arr-list" v-if="num==4&&gameName==2">
<image class="arr-up" @click="addsendType('up')"
:src="toucClass?toucClass.up?'../../static/roomes/shangb.png':'../../static/roomes/shang.png':'../../static/roomes/shang.png'">
</image>
<image class="arr-left" @click="addsendType('left')" @touchstart="oNtouchstart('left')"
@touchend="oNtouchend('left')"
:src="toucClass?toucClass.left?'../../static/roomes/leftb.png':'../../static/roomes/left.png':'../../static/roomes/left.png'">
</image>
<image class="arr-right" @click="addsendType('right')" @touchstart="oNtouchstart('right')"
@touchend="oNtouchend('right')"
:src="toucClass?toucClass.right?'../../static/roomes/rightb.png':'../../static/roomes/right.png':'../../static/roomes/right.png'">
</image>
<image class="arr-down" @click="addsendType('down')"
:src="toucClass?toucClass.down?'../../static/roomes/xiab.png':'../../static/roomes/xia.png':'../../static/roomes/xia.png'">
</image>
</view>
<!-- 攻击键 -->
<image class="arr" @click="addsendType('fire')" @touchstart="oNtouchstart('fire')"
@touchend="oNtouchend('fire')"
:src="toucClass?toucClass.fire?'../../static/roomes/gojib.png':'../../static/roomes/goji.png':'../../static/roomes/goji.png'"
v-if="num==4"></image>
<u-popup mode="center" bgColor="transparent" :show="show5" @close="show5=false">
<view class="boop" @click.stop>
<image src="../../static/img/gbb.png" class="model-close" @click.stop="show5 = false"></image>
<view class="ttnoe1"> <text class="ttt1">{{noticeTitle}}</text></view>
<view class="paddf" style="margin-bottom: 10px">
<scroll-view @touchmove.stop style="width: 390px;height: 150px;" scroll-with-animation scroll-y="true">
<mp-html :content="Notice" container-style="color: #fff;font-size: 12px;width: 380px;" />
</scroll-view>
</view>
</view>
</u-popup>
<u-popup mode="center" bgColor="transparent" :show="show7" @close="show7=false">
<view class="boop" @click.stop>
<image src="../../static/img/gbb.png" class="model-close" @click.stop="show7 = false"></image>
<view class="ttnoe1"> <text class="ttt1">结算</text></view>
<view class="paddf" style="margin-bottom: 10px">
<text class="ttt2">
是否结算
</text>
</view>
<view class="btn-right">
<image class="btn-bg" src="../../static/img/ann.png"></image>
<text class="butnoe" @click.stop="endsendType()">确定</text>
</view>
</view>
</u-popup>
<u-popup mode="center" bgColor="transparent" :show="showboop" @close="showboop=false">
<view class="boop" @click.stop>
<image src="../../static/img/gbb.png" class="model-close" @click.stop="showboop = false"></image>
<view class="ttnoe1"> <text class="ttt1">爆机</text></view>
<view class="paddf" style="margin-bottom: 10px">
<text class="ttt2">
是否上报爆机
</text>
</view>
<view class="btn-right">
<image class="btn-bg" src="../../static/img/ann.png"></image>
<text class="butnoe" @click.stop="doshot()">确定</text>
</view>
</view>
</u-popup>
<u-popup mode="center" bgColor="transparent" :show="show10" @close="show10=false">
<view class="boop" @click.stop>
<image src="../../static/img/gbb.png" class="model-close" @click.stop="show10 = false"></image>
<view class="ttnoe1"> <text class="ttt1">声音</text></view>
<view class="paddf flex-row justify-between" @click.stop="onshowimg()">
<text class="ttt2" style="width: 100px;">
静音
</text>
<image v-if="showimg" src="../../static/roomes/gb.png" class="gbimg"></image>
<image v-else src="../../static/roomes/gb2.png" class="gbimg"></image>
</view>
</view>
</u-popup>
<u-popup mode="center" bgColor="transparent" :show="show4" @close="show4=false">
<view class="boop" @click.stop>
<image src="../../static/img/gbb.png" class="model-close" @click.stop="show4 = false"></image>
<view class="ttnoe1"> <text class="ttt1">报修</text></view>
<view class="paddf flex-row flex-wrap">
<view v-for="(item, index) in repairType" :key="index" @click.stop="navclick(index)"
:class="item.show == true ? 'lanb' : 'lan'">
<text class="lantxt">{{ item.dictLabel }}</text>
</view>
<view v-if="3- repairType.length%3!=3" v-for="(item, index) in (3- repairType.length%3)"
:key="index" class="bttann"></view>
</view>
<view class="btn-right">
<image class="btn-bg" src="../../static/img/ann.png"></image>
<text class="butnoe" @click.stop="adddictLabel()">确定</text>
</view>
</view>
</u-popup>
<!-- 充值 -->
<u-popup mode="center" bgColor="transparent" :show="showzhi" @close="showzhi=false">
<view class="boop" @click.stop>
<image src="../../static/img/gbb.png" class="model-close" @click.stop="showzhi = false"></image>
<view class="ttnoe1" style="margin-bottom: 12px;"> <text class="ttt1">充值</text></view>
<view class="flex-row align-center" style="padding: 0 20px;">
<view v-for="(item,index) in Arrdata" :key="index"
style="padding-right: 25px;padding-bottom: 12px;" @click="getpackages(item,index)">
<text style="font-size: 13px;color: #fff;">{{item.dictLabel}}</text>
</view>
</view>
<scroll-view @touchmove.stop style="height: 190px;padding: 0 20px;" scroll-with-animation
class="Scroll" scroll-y="true">
<view class="txtbody flex-row justify-between flex-wrap" v-if="numArr==0||numArr==1">
<view class="list-tt flex-col align-center" v-for="(item,index) in packagesArr" :key="index"
@click="gettestBuy(item)">
<image src="../../static/img/bj.png" class="bjimg" mode=""></image>
<view class="t1">
<text class="t1">{{item.name}}</text>
</view>
<image :src="item.picUrl" class="jinbi" mode="" style="width: 36px;height: 27px;">
</image>
<view class="lh" v-if="item.remark">
<text class="txt3">{{item.remark}}</text>
</view>
<view class="t2">
<text style="font-size: 13px;color: #674B00;">{{item.coin}}币</text>
</view>
<view class="t3">
<text style="font-size: 13px;color: #fff;">￥{{item.amount}}</text>
</view>
</view>
<view v-if="4-Number(packagesArr.length%4) != 4"
v-for="(item,index) in (4- Number(packagesArr.length%4))" :key="index"
class="listbb-txt" style="flex-shrink: 1;">
</view>
</view>
<view class="txtbody flex-row justify-between flex-wrap" v-if="numArr==2">
<view class="lista flex-col align-center" v-for="(item,index) in packagesArr" :key="index"
@click="gettestBuy(item)">
<image src="../../static/img/bj2.png" class="listaimg" mode=""></image>
<view class="lh" v-if="item.remark">
<text style="font-size: 9px;color: #FFFFFF;line-height:14px;">{{item.remark}}</text>
</view>
<view class="t1">
<text class="txt1">{{item.name}}</text>
</view>
<view class="t2">
<text class="txt1"
style="font-size: 12px;color: #674B00;">共得{{item.allCoin}}币</text>
</view>
<image :src="item.picUrl" class="jinbi" mode=""
style="width: 45px;height: 38px;margin-bottom: 5px;">
</image>
<view class="t2" style="margin-bottom: 0rpx;">
<text class="txt1" style="font-size: 12px;color: #674B00;">立得 {{item.coin}}
金币</text>
</view>
<view class="t2" style="margin-bottom: 2px;">
<text class="txt1"
style="font-size: 12px;color: #674B00;">每日得{{item.incrementalCoin}}币*{{item.days}}天
</text>
</view>
<view class="t3">
<image class="timg" src="../../static/img/lu.png" mode=""></image>
<text class="ttxt3">￥{{item.amount}}</text>
</view>
</view>
<view v-if="3-Number(packagesArr.length%3) != 3"
v-for="(item,index) in (3- Number(packagesArr.length%3))" :key="index" class="lista-txt"
style="flex-shrink: 1;">
</view>
</view>
</scroll-view>
</view>
</u-popup>
<!-- // <u-popup mode="center" bgColor="transparent" :overlayStyle="{background:'#000'}" :duration="0" :show="showlogo" > -->
<view :style="{width:Number(windowWidth+50)+'px',height:windowHeight+'px'}" class="bodyy" v-if="showlogo">
<view class="posrel">
<image src="../../static/room/logo.gif" class="lanbody" mode=""></image>
<image src="../../static/room/logo.png" class="poass" mode="">
</image>
<text class="clf txt11">
正在加载中...
</text>
</view>
</view>
<!-- </u-popup> -->
<!-- 积分兑换 -->
<u-popup mode="center" bgColor="transparent" :show="showa" @close="showa=false">
<view class="boop">
<image src="../../static/img/gbb.png" class="model-close" @click.stop="showa = false"></image>
<view class="ttnoe1"> <text class="ttt1">积分兑换</text></view>
<view class="paddf">
<view class="mbb4">
<text class="mbb4txt">当前积分：</text>
<text class="mbb4txt" style="text-align: right;">{{roomNum.integral}}</text>
</view>
<view class="mbb4">
<text class="mbb4txt">可兑换金币：</text>
<text class="mbb4txt" style="text-align: right;">
{{roomNum.exchangeCoins}}
</text>
</view>
<view class="mbb4">
<text class="mbb4txt">兑换比：</text>
<text class="mbb4txt" style="text-align: right;">{{roomNum.terms}}积分是1金币</text>
</view>
<view class="mbb4">
<text class="mbb4txt">
兑换数量：
</text>
<input type="number" class="inp" placeholder="请输入" confirm-type="send" :confirm-hold="true"
:value="realName" @input="getnameb" />
</view>
</view>
<view class="btn-right">
<image class="btn-bg" src="../../static/img/ann.png"></image>
<text class="butnoe" @click.stop="addTeam()">确定</text>
</view>
</view>
</u-popup>
<!-- 聊天框 -->
<u-popup mode="center" bgColor="transparent" :show="ccshow" zIndex="99999"
@close="ccshow=false;showTume = 60">
<view class="flex-row bbn align-center justify-between" :style="{width:windowWidth+'px'}">
<input type="text" class="textiput" confirm-type="send" :confirm-hold="true" @confirm="sendChatMsg"
@input="getname" placeholder="请输入内容" :value="content" :focus="true" />
<text class="txtty" @click="sendChatMsg">发送</text>
<text class="txtty" style="color: #ccc;" @click="ccshow=false;showTume = 60">取消</text>
</view>
</u-popup>
<!-- 特效 -->
<view v-if="arrdata&&showroom" class="">
<view class="boofd">
<image class="btn-bg" src="../../static/room/lanm.png"></image>
<text class="butnoe">{{arrdata?arrdata.userName:""}}</text>
<image class="k1" src="../../static/room/kuan.png" mode=""></image>
</view>
<view class="boodyes">
<image :src="arrdata?arrdata.gifUrl:''" style="width: 133px;height: 102px;" mode=""></image>
</view>
</view>
</view>
</view>
</template>
<script>
// import {
// setLicence
// } from "@/uni_modules/XF-txLivePlayerUTS"
export default {
data() {
return {
show: true,
windowWidth: 0,
windowHeight: 70,
url: "",
shot: '',
showlogo: true,
show3: true,
data: [{
img: "/static/room/tt3.png",
name: "客服",
}, {
img: "/static/room/tt1.png",
name: "报修",
},
{
img: "/static/room/tt6.png",
name: "玩法",
}, {
img: "/static/room/ttt2.png",
name: "爆机",
},
{
img: "/static/room/ttt3.png",
name: "结算",
},
// {
// img: "/static/room/tt7.png",
// name: "聊天",
// },
{
img: "/static/room/tt8.png",
name: "静音",
},
{
img: "/static/room/fd.png",
name: "全屏",
},
],
repairType: [],
show7: false,
show3: false,
show4: false,
show: false,
show5: false,
show6: false,
roomDetailData: "",
liveAddress: "",
id: '',
seatListdata: [],
num: 1,
player: '',
token: "",
user: "",
winnerType: [],
roomNotice: '',
captureid: "",
timeout: {},
up: true,
typetxt: "",
realName: "",
showa: false,
roomNum: 0,
content: "",
chatshow: false,
chatList: [],
ccshow: false,
showboop: false,
auto: {},
touchKey: {},
show10: false,
showq: false,
showimg: false,
spectatorUser: [],
socketTimer: null, // 定时器
videoContext: null,
socketTask: null,
itemId: null,
showzhi: false,
packagesArr: [],
Arrdata: [],
numArr: [],
showPay: true,
touchFirst: {},
setTimeoutdf: null,
showTume: 60,
IntervalTme: null,
sstme: 120,
Interval: null,
clientId: "clientId",
wsInitialized: false,
seatId: "",
gameName: "",
ssdata: 300,
Notice: "",
showroom: false,
isroom: [],
arrdata: '',
toucClass: {},
noticeTitle: "",
os: "",
scalingMode: 'fill',
quNum: 0,
aspectRatio: true
}
},
onLoad(optinos) {
let that = this
uni.getSystemInfo({
success: function(info) {
that.windowWidth = info.windowWidth > info.windowHeight ? info.windowWidth :
info.windowHeight
that.windowHeight = info.windowWidth < info.windowHeight ? info.windowWidth :
info.windowHeight
}
});
this.init();
this.landscape = optinos.flag
this.id = optinos.id
console.log(this.landscape);
this.clientId = optinos.gen
// if (this.landscape == 1) {
this.landscape = 0
let aa = uni.getStorageSync('thorui_switch')
// #ifdef APP-PLUS
let os = plus.os.name;
if (os == 'Android') {
this.os = 1
} else {
this.os = 2
}
// #endif
if (aa == 1) {
let bb = uni.getStorageSync("thorui_show") ? uni.getStorageSync("thorui_show") : false;
this.showimg = bb
} else {
this.showimg = true
}
this.data = this.data.map(item => {
if (item.name == '静音') {
item.img = !this.showimg ? "/static/room/tt10.png" : "/static/room/tt8.png";
}
return item
})
if (optinos.seatId) {
this.seatId = optinos.seatId
// this.num = 4
} else {
this.seatId = ''
}
this.gameName = optinos.gameName
this.roomDetailData = null
this.getdata()
},
onShow() {
// #ifdef APP-PLUS
plus.screen.lockOrientation('landscape-primary'); //锁定横屏
plus.navigator.setFullscreen(true); //隐藏状态栏(应用全屏:只能隐藏状态栏，标题栏和虚拟返回键都还可以显示)
plus.navigator.hideSystemNavigation()
// #endif
if (!this.wsInitialized) {
this.wsInitialized = true
this.initWebSocket()
}
this.getcell()
let that = this
uni.getSystemInfo({
success: function(info) {
that.windowWidth = info.windowWidth > info.windowHeight ? info.windowWidth :
info.windowHeight
that.windowHeight = info.windowWidth < info.windowHeight ? info.windowWidth :
info.windowHeight
}
});
if (this.os == 1) {
if (this.$refs.customVideoView) {
this.$refs.customVideoView.pause();
}
} else {
}
uni.setStorageSync('primary', 2);
this.showlogo = true
this.showTume = 60
this.sstme = this.ssdata
this.setaTmieheng();
this.getUser();
this.getroom();
if (this.num == 4) {
this.setTmie()
}
},
// 页面关闭时清除横屏正方向
onUnload() {
uni.setStorageSync('primary', 1);
// #ifdef APP-PLUS
plus.screen.lockOrientation('portrait-primary');
// #endif
// if (this.num == 4) {
getApp().$api.endGame({}).then(res => {})
// }
if (this.IntervalTme) {
this.showTume = 60
clearInterval(this.IntervalTme)
this.IntervalTme = null
}
console.log('离开页面')
getApp().$api.leaveRoom({
roomId: this.id
}).then(res => {
console.log(JSON.stringify(res))
})
getApp().$webss.clearMessage(this.clientId)
if (this.os == 1) {
if (this.$refs.customVideoView) {
this.$refs.customVideoView.pause();
}
} else {
this.$refs['ijkvideo'].pause()
}
},
methods: {
onshowimg() {
this.showimg = !this.showimg
},
// if
getcell() {
// #ifdef APP-PLUS
let os = plus.os.name;
if (os == 'Android') {
this.os = 1
} else {
this.os = 2
}
// #endif
},
getname(e) {
this.content = e.detail.value;
},
getnameb(e) {
console.log(JSON.stringify(e.detail.value))
this.realName = e.detail.value;
},
getUser() {
getApp().$api.getUserInfo({}).then(res => {
this.user = res.data
// 确保只初始化一次 WebSocket 监听
// if (!this.wsInitialized) {
// this.wsInitialized = true
// this.initWebSocket()
// }
})
},
onplay() {
this.showgg = true
console.log("开始播放")
let videoContext = uni.createVideoContext('player-container-id'); //这里的'myVideo'要和上方video标签的id相对应
if (this.setTimeoutdf) {
clearTimeout(this.setTimeoutdf)
this.setTimeoutdf = null
}
this.setTimeoutdf = setTimeout(() => {
videoContext.playbackRate(2.0) //括号里面可以设置倍速
setTimeout(() => {
videoContext.playbackRate(1.0) //括号里面可以设置倍速
}, 7000)
}, 2000)
},
getRooms() {
this.showroom = true
console.log('特效222')
this.arrdata = this.isroom[0]
setTimeout(() => {
this.showroom = false
this.arrdata = ''
this.isroom = this.isroom.filter((item, index) => index != 0)
if (this.isroom.length > 0) {
this.getRooms()
}
}, 3000)
},
initWebSocket() {
const that = this
// 先清除之前的监听
getApp().$webss.clearMessage(this.clientId)
// 添加新的监听
getApp().$webss.onMessage(data => {
// 使用 nextTick 确保数据更新和视图同步
switch (data.type) {
// case 'maintenance':
// that.handleMaintenance().
// if (this.os == 1) {
// if (this.$refs.custoomVideoView.pause();
// }
// } else {
// this.$refs["txLivePlayer"].pauseVideo();
// this.$refs["txLivePlayer"].pauseAudio();
// }
// break
case 'next_user':
console.log("说明排队已经到了当前用户", JSON.stringify(data))
this.addseatId()
break
case 'queue_position':
console.log("队列位置变动的时候通知", JSON.stringify(data))
// {"type":"queue_position","msg":"排队结束,当前用户可上机","index":15}
this.quNum = data.index
break
case 'in_room':
console.log("收到消息,特效变动", JSON.stringify(data))
// let id = Date.now()
that.isroom.push(data)
if (that.showlogo) {
setTimeout(function() {
that.getRooms()
}, 2000)
} else {
that.getRooms()
}
break
case 'spectator':
console.log("收到消息,围观用户变动", data)
that.spectatorUser = [...data.spectatorUser]
break
case 'surplus':
console.log("收到消息,用户余额变动", data)
that.user = {
...that.user,
coin: data.coin,
integral: data.integral
}
break
case 'chat':
console.log("收到消息,聊天信息", data)
that.chatList = [...that.chatList, data]
that.$nextTick(() => {
that.itemId = "" + (that.chatList.length - 1)
})
break
case 'seat':
console.log("收到消息,机位状态变动", data)
that.seatListdata = [...data.seatList]
that.showTume = 60
break
}
}, this.clientId)
},
handleMaintenance() {
this.show7 = false
this.num = 1
this.showTume = 60
this.setaTmieheng()
},
getroom() {
let that = this;
getApp().$api.roomDetail({
id: this.id,
seatId: this.seatId
}).then(res => {
// console.log("获取房间信息 ====== ", JSON.stringify(that.roomDetailData.type))
that.roomDetailData = res.data
if (that.roomDetailData) {
// console.log("获取房间信息 ====== ", JSON.stringify(that.roomDetailData))
if (that.roomDetailData.type == 3) {
that.gameName = 1
}
}
setTimeout(function() {
that.showlogo = false;
}, 2000)
if (this.os == 1) {
setTimeout(function() {
that.$refs.customVideoView.init();
}, 1000)
} else {
this.$refs['ijkvideo'].play()
}
})
},
getdata() {
let that = this;
console.log('刷新==========================', this.id)
getApp().$api.seatList({
roomId: this.id
}).then(res => {
this.seatListdata = res.data
this.showTume = 60
this.setaTmieheng();
})
getApp().$api.roomNotice({
roomId: this.id
}).then(res => {
// console.log(JSON.stringify(res.data))
if (res.data) {
if (res.data.length > 0) {
this.roomNotice = res.data[0].noticeContent
}
}
})
},
oNtouchstart(str) {
console.log('执行=》11111111')
this.toucClass[str] = true;
setTimeout(() => {
this.toucClass[str] = false;
}, 50)
clearTimeout(this.timeout[str]);
let that = this
that.touchKey[str] = true;
this.sstme = this.ssdata
this.timeout[str] = setTimeout(function() {
if (that.touchKey[str]) {
console.log('执行=》')
getApp().$api.continuousStart(str).then(res => {
console.log('执行=》', JSON.stringify(res))
if (res.code == 200) {
that.auto[str] = true;
that.touchKey[str] = false;
that.touchFirst[str] = true;
if (str == 'append') {
uni.showToast({
title: '攻击加倍开始，再次点击加倍结束',
icon: 'none',
duration: 2000
})
} else if (str == 'coin') {
uni.showToast({
title: '连续上分开始，再次点击上分结束',
icon: 'none',
duration: 2000
})
} else if (str == 'fire') {
uni.showToast({
title: '连续攻击开始，再次点击攻击结束',
icon: 'none',
duration: 2000
})
} else if (str == 'left') {
uni.showToast({
title: '连续左开始，再次点击左结束',
icon: 'none',
duration: 2000
})
} else if (str == 'right') {
uni.showToast({
title: '连续右开始，再次点击右结束',
icon: 'none',
duration: 2000
})
} else {
uni.showToast({
title: '连击开始，再按一下就结束',
icon: 'none',
duration: 2000
})
}
that.sstme = that.ssdata
clearInterval(that.Interval)
}
})
}
}, 1000);
},
oNtouchend(str) {
this.touchKey[str] = false;
clearTimeout(this.timeout[str]);
},
stopAutp(str) {
getApp().$api.continuousStop(str, {}).then(res => {
if (res.code == 200) {
this.auto[str] = false;
let show = false;
for (let key in this.auto) {
console.log(this.auto[key], 'ok')
if (this.auto[key]) {
show = true
}
}
if (show == true) {
} else {
let that = this;
that.sstme = that.ssdata
that.setTmie();
}
}
})
},
addsendType(str) {
console.log('点击事件===>')
if (!this.touchFirst[str]) {
if (this.auto[str]) {
this.stopAutp(str);
}
} else {
this.sstme = this.ssdata;
this.touchFirst[str] = false;
}
let that = this;
getApp().$api.sendType(str, {}).then(res => {
})
},
adddictLabel() {
if (this.typetxt) {
let data = {
type: this.typetxt,
remark: '',
roomId: this.id
}
getApp().$api.repairReport(data).then(res => {
// console.log('res=>', JSON.stringify(res))
this.show4 = false;
this.typetxt = '';
this.repairType = this.repairType.map(item => {
item.show = false
return item
})
uni.showToast({
title: res.msg,
icon: 'none',
duration: 2000
})
})
}
},
endsendType(str) {
let that = this;
getApp().$api.endGame({}).then(res => {
that.show7 = false;
that.num = 1
that.sstme = that.ssdata
clearInterval(that.Interval)
that.showTume = 60
that.setaTmieheng();
})
},
navtoclick(name) {
if (this.ssdata) {
this.sstme = this.ssdata
}
this.showTume = 60
if (name == '结算') {
this.show7 = true;
}
if (name == '玩法') {
getApp().$api.gameplayNotice({
roomId: this.id
}).then(res => {
console.log(JSON.stringify(res))
this.show5 = true;
this.Notice = res.data[0].noticeContent
this.noticeTitle = res.data[0].noticeTitle
})
}
if (name == '聊天') {
this.chatshow = true;
}
if (name == '报修') {
getApp().$api.repairType({}).then(res => {
if (res.data) {
if (res.data.length > 0) {
this.repairType = res.data.map(item => {
item.show = false
return item
})
}
}
this.show4 = true;
})
}
if (name == "爆机") {
this.showboop = true
}
if (name == "静音") {
// this.show10 = true
this.showimg = !this.showimg
this.data = this.data.map(item => {
if (item.name == '静音') {
item.img = !this.showimg ? "/static/room/tt10.png" : "/static/room/tt8.png";
}
return item
})
}
if (name == "客服") {
if (this.os == 1) {
if (this.$refs.customVideoView) {
this.$refs.customVideoView.pause();
}
} else {
this.$refs['ijkvideo'].pause()
// this.$refs["txLivePlayer"].pauseVideo();
// this.$refs["txLivePlayer"].pauseAudio();
}
this.showTume = 60
this.sstme = this.ssdata
if (this.IntervalTme) {
clearInterval(this.IntervalTme);
this.IntervalTme = null;
}
if (this.Interval) {
clearInterval(this.Interval)
this.Interval = null
}
uni.navigateTo({
url: `/pages/index/chat/chat`
})
}
if (name == '兑奖') {
getApp().$api.winnerType({
roomId: this.id
}).then(res => {
// console.log('winnerType=>', JSON.stringify(res))
if (res.data) {
if (res.data.length > 0) {
this.winnerType = res.data.map(item => {
item.show = false
return item
})
}
}
this.show6 = true;
})
}
if (name == '全屏') {
if (this.os == 2) {
if (this.scalingMode == 'aspectFit') {
this.scalingMode = 'fill'
} else {
this.scalingMode = 'aspectFit'
}
} else {
this.aspectRatio = !this.aspectRatio
}
}
},
back() {
let that = this;
if (that.num == 4) {
this.show7 = true;
} else {
uni.navigateBack();
}
},
addTeam() {
this.showTume = 60;
let that = this;
console.log(this.realName, "=============>")
getApp().$api.exchangeCoins({
coins: this.realName
}).then(res => {
console.log('弹出框', "=============>")
that.showa = false;
uni.showToast({
title: res.msg,
icon: 'none',
duration: 2000
})
getApp().$api.getUserInfo({}).then(res => {
that.user = res.data
})
})
},
navclick(index) {
this.repairType = this.repairType.map((item, num) => {
if (num == index) {
item.show = !item.show;
if (item.show == true) {
this.typetxt = item.dictValue
} else {
this.typetxt = ''
}
} else {
item.show = false
}
return item;
});
},
navto() {
let that = this;
this.getArr()
this.showTume = 60
},
gettestBuy(item) {
this.showzhi = false
this.showTume = 60
this.sstme = this.ssdata
if (this.os == 1) {
if (this.$refs.customVideoView) {
this.$refs.customVideoView.pause();
}
} else {
this.$refs['ijkvideo'].pause()
}
if (this.IntervalTme) {
clearInterval(this.IntervalTme);
this.IntervalTme = null;
}
if (this.Interval) {
clearInterval(this.Interval)
this.Interval = null
}
uni.setStorageSync('primary', 1);
uni.navigateTo({
url: `/pages/room/recharge?id=${item.id}&amount=${item.amount}&sid=2&coin=${item.coin}`
})
},
getArr() {
getApp().$api.getByType({
type: "recharge_package_type"
}).then(res => {
this.Arrdata = res.data
if (this.Arrdata.length > 0) {
this.getpackages(this.Arrdata[0], 0)
}
})
},
getpackages(item, index) {
this.numArr = index;
this.packagesArr = []
getApp().$api.packages({
type: item.dictValue
}).then(res => {
this.packagesArr = res.data
this.showzhi = true
})
},
navshowa() {
this.showTume = 60
getApp().$api.terms({}).then(res => {
this.showa = true
this.roomNum = res.data
this.realName = res.data.exchangeCoins
})
},
numClick(seatId, status) {
this.seatId = seatId
if (status == '0') {
this.num = 2;
} else {
this.num = 3;
}
this.showTume = 60;
this.setaTmieheng();
},
addlineup() {
// this.seatId = seatId
// console.log('====================》' + seatId)
getApp().$api.lineup({
seatId: this.seatId
}).then(res => {
if (res.code == 200) {
this.quNum = res.data
this.num = 5
if (this.IntervalTme) {
this.showTume = 60
clearInterval(this.IntervalTme)
this.IntervalTme = null
}
this.setaTmieheng();
uni.showToast({
title: res.msg,
icon: 'none',
duration: 2000
})
}
})
},
addcancelLineup() {
getApp().$api.cancelLineup({
seatId: this.seatId
}).then(res => {
if (res.code == 200) {
this.num = 1
this.seatId = ''
this.setaTmieheng();
uni.showToast({
title: res.msg,
icon: 'none',
duration: 2000
})
}
})
},
sendChatMsg() {
this.showTume = 60
if (this.content) {
let data = {
content: this.content,
}
getApp().$api.sendChatMsg(data).then(res => {
this.ccshow = false;
this.content = ''
})
}
},
addseatId() {
let that = this;
this.showTume = 60
clearInterval(this.IntervalTme)
this.IntervalTme = null
getApp().$api.inGame({
seatId: this.seatId
}).then(res => {
getApp().$api.inactiveTime({}).then(res => {
console.log(JSON.stringify(res))
that.num = 4;
that.setaTmieheng();
that.sstme = res.data;
that.ssdata = res.data;
that.setTmie();
})
})
},
init() {
// 初始化准备
getApp().$api.getByType({
type: 'seat_status'
}).then(res => {
this.seatStatusDict = res.data;
})
},
translate(key, dict) {
return key != null && dict.find(item => item.dictValue === key).dictLabel || null;
},
setshowboop() {
this.showboop = false
},
doshot() {
this.showboop = false
if (this.os == 1) {
this.$refs.customVideoView.snapshot();
} else {
// uni.createVideoContext('player-container-id').pause()
// setTimeout(() => {
// this.getSaveImg()
// }, 1000)
this.$refs['ijkvideo'].captureVideoImage()
// this.$refs['ijkvideo'].pause()
}
},
videoSizeChanged(res) {
console.log('videoSizeChanged', res.detail.videoWidth, res.detail.videoHeight)
},
captureVideoImageChanged(res) {
let captureVideoImagePath = 'file://' + res.detail.imagePth
// 上传文件
uni.showLoading({
mask: true,
title: '上传中...'
});
getApp().$api.uploadimg({
file: captureVideoImagePath,
id: ''
}).then(res => {
uni.hideLoading();
uni.showToast({
title: res.msg,
icon: 'none',
duration: 2000
});
}).catch(err => {
uni.showToast({
title: '上传失败',
icon: 'none'
});
});
},
onsnapshotcomplete(e) {
console.log("触发截图回调方法")
console.log(JSON.stringify(e))
},
snapshotCallback(e) {
console.log("触发截图回调方法")
let that = this
uni.showLoading({
mask: true,
title: '上传中...'
})
// 将base64转换为本地临时文件
let base64Data = e.detail.data;
let fileName = 'img' + Date.now() + ".png";
// #ifdef APP-PLUS
// 将base64转换为本地文件
const bitmap = new plus.nativeObj.Bitmap('bitmap' + Date.now());
bitmap.loadBase64Data(base64Data, () => {
bitmap.save('_doc/' + fileName, {}, (i) => {
console.log('保存图片成功：' + JSON.stringify(i.target));
// 上传文件
getApp().$api.uploadimg({
file: i.target,
id: ''
}).then(res => {
console.log(JSON.stringify(res))
if (that.$refs.customVideoView) {
that.$refs.customVideoView.play();
}
uni.showToast({
title: res.msg,
icon: 'none',
duration: 2000
});
// 清理临时文件
bitmap.clear();
}).catch(err => {
uni.showToast({
title: '上传失败',
icon: 'none'
});
bitmap.clear();
});
}, (e) => {
console.log('保存图片失败：' + JSON.stringify(e));
uni.showToast({
title: '保存失败',
icon: 'none'
});
bitmap.clear();
});
});
// #endif
},
snapshot() {
// 截图方法
this.$refs.customVideoView.snapshot();
},
getSaveImg(data) {
let that = this;
var pages = getCurrentPages();
var page = pages[pages.length - 1];
console.log("当前页" + (pages.length - 1));
var bitmap = null;
var currentWebview = page.$getAppWebview();
// #ifdef APP-PLUS
// bitmap = new plus.nativeObj.Bitmap('amway_img');
bitmap = new plus.nativeObj.Bitmap('bitmap' + Date.now());
// 将webview内容绘制到Bitmap对象中
// 延迟截取，确保页面完全渲染
uni.showLoading({
mask: true,
title: '上传中...'
});
currentWebview.draw(bitmap, function() {
console.log('截屏绘制图片成功');
let png = 'img' + Date.now() + ".png"
console.log(png)
bitmap.save("_doc/" + png, {}, function(i) {
console.log('保存图片成功：' + JSON.stringify(i));
getApp().$api.uploadimg({
file: i.target,
id: ''
}).then(res => {
// that.$refs.customVideoView.play();
console.log(JSON.stringify(res))
uni.createVideoContext('player-container-id').play()
// if (that.$refs.customVideoView) {
// that.$refs.customVideoView.play();
// }
uni.showToast({
title: res.msg,
icon: 'none',
duration: 2000
})
})
}, function(e) {
console.log('保存图片失败：' + JSON.stringify(e));
});
}, function(e) {
console.log('截屏绘制图片失败：' + JSON.stringify(e));
});
// #endif
},
initCallback(e) {
console.log("播放器初始化回调方法 ===== ", JSON.stringify(e));
},
setTmie() {
let that = this;
if (this.Interval) {
clearInterval(this.Interval)
this.Interval = null
}
that.Interval = setInterval(() => {
that.sstme = that.sstme - 1;
if (that.sstme == 0) {
that.sstme = 0
clearInterval(that.Interval)
that.Interval = null
that.endsendType()
}
}, 1000)
},
setaTmieheng() {
let that = this;
if (this.IntervalTme) {
clearInterval(this.IntervalTme);
this.IntervalTme = null;
}
if (this.num == 3 || this.num == 1 || this.num == 2) {
console.log('倒计时开始 ')
this.IntervalTme = setInterval(() => {
that.showTume = that.showTume - 1;
if (that.showTume == 0) {
that.showTume = 60
clearInterval(this.IntervalTme)
uni.navigateBack()
}
}, 1000)
} else {
console.log('倒计时结束 ')
}
},
onInputBlur() {
// 防止输入框失焦时自动关闭弹窗
setTimeout(() => {
if (this.ccshow) {
this.$nextTick(() => {
// 重新获取焦点
const inputEl = this.$el.querySelector('.textiput');
if (inputEl) {
inputEl.focus();
}
});
}
}, 100);
},
closeChatInput() {
this.ccshow = false;
this.showTume = 60;
this.content = '';
}
},
}
</script>
<style lang="scss" scoped>
@import './roomheng.scss';
</style>
}
