8 changed files with 289 additions and 14 deletions
@ -0,0 +1,121 @@ |
|||
<template> |
|||
<v-page> |
|||
<v-header :title="$t('common.service')"></v-header> |
|||
<view class="onsczone"> |
|||
<web-view v-if="isLoad" :src="csurl" style="margin-top: 3rem;"></web-view> |
|||
<view style="display: flex;justify-content: center;align-items: center;" v-else> |
|||
<div class="loader"></div> |
|||
<div style="font-size: 20px;margin-left: 10px;">{{$t('common.loading')}}<span>...</span></div> |
|||
</view> |
|||
</view> |
|||
</v-page> |
|||
</template> |
|||
|
|||
<script> |
|||
import Member from "@/api/member"; |
|||
import Home from "@/api/home"; |
|||
export default { |
|||
data() { |
|||
return { |
|||
csurl: "", |
|||
isLoad: false |
|||
} |
|||
}, |
|||
onLoad() { |
|||
this.mkcslinks() |
|||
}, |
|||
methods: { |
|||
// build |
|||
mkcslinks() { |
|||
let user = uni.getStorageSync('user') |
|||
if (user) { |
|||
let ustr = JSON.parse(user) |
|||
console.log(ustr) |
|||
Member.getUnameByUid({user_id: 1}).then(rfres => { |
|||
let rfu = rfres.data; |
|||
// query referr uname |
|||
let chaturl = "https://cs.skybtcs.com/chat/?toid=" + rfu.username + "&room_id=" + ustr.account + "&usid=" + ustr.user_id; |
|||
//this.csurl += rfres.username+"&room_id="+ustr.account+"&usid="+ustr.user_id; |
|||
// console.log("dd",chaturl); |
|||
this.csurl = chaturl; |
|||
this.isLoad = true; |
|||
if(this.isLoad===true){ |
|||
this.chatRead() |
|||
} |
|||
}) |
|||
console.log("user", this.csurl) |
|||
} |
|||
}, |
|||
chatRead(){ |
|||
Home.chatRead().then(res => { |
|||
console.log(res,'已读'); |
|||
}) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
<style> |
|||
|
|||
</style> |
|||
<style scoped> |
|||
.onsczone { |
|||
margin-top: 12rem; |
|||
} |
|||
|
|||
.loader { |
|||
width: 50px; |
|||
aspect-ratio: 1; |
|||
display: grid; |
|||
border: 4px solid #0000; |
|||
border-radius: 50%; |
|||
border-right-color: #25b09b; |
|||
animation: l15 1s infinite linear; |
|||
} |
|||
|
|||
.loader::before, |
|||
.loader::after { |
|||
content: ""; |
|||
grid-area: 1/1; |
|||
margin: 2px; |
|||
border: inherit; |
|||
border-radius: 50%; |
|||
animation: l15 2s infinite; |
|||
} |
|||
|
|||
.loader::after { |
|||
margin: 8px; |
|||
animation-duration: 3s; |
|||
} |
|||
|
|||
@keyframes l15 { |
|||
100% { |
|||
transform: rotate(1turn) |
|||
} |
|||
} |
|||
|
|||
span { |
|||
display: inline-block; |
|||
height: 1em; |
|||
line-height: 1; |
|||
text-align: left; |
|||
vertical-align: -.25em; |
|||
overflow: hidden; |
|||
} |
|||
|
|||
span::before { |
|||
display: block; |
|||
content: '...\A..\A.'; |
|||
white-space: pre-wrap; |
|||
animation: dot 3s infinite step-start both; |
|||
} |
|||
|
|||
@keyframes dot { |
|||
33% { |
|||
transform: translateY(-2em); |
|||
} |
|||
|
|||
66% { |
|||
transform: translateY(-1em); |
|||
} |
|||
} |
|||
</style> |
|||
|
After Width: | Height: | Size: 1.4 KiB |
Loading…
Reference in new issue