- 管理端前端设备判定改为按宽高比(嵌入竖屏容器时正确使用手机版布局) - 统计上报跨源读取 parent.location 报错防护(降级用 referrer) - 续接会话时校验客服在线,离线不再误入聊天页 - 聊天记录整理与消息发送的用户资料缺失空值防护,避免接口 400 - entrypoint 数据库导入加空库守卫,容器重启/线上更新不再重置数据
65 lines
1.6 KiB
Vue
65 lines
1.6 KiB
Vue
<template>
|
|
<div id="app">
|
|
<router-view/>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { on, off } from 'iview/src/utils/dom'
|
|
import { setMatchMedia } from 'iview/src/utils/assist'
|
|
|
|
|
|
import { mapMutations } from 'vuex'
|
|
|
|
setMatchMedia()
|
|
|
|
export default {
|
|
name: 'app',
|
|
methods: {
|
|
...mapMutations('media', [
|
|
'setDevice'
|
|
]),
|
|
handleWindowResize () {
|
|
this.handleMatchMedia()
|
|
},
|
|
handleMatchMedia () {
|
|
// 竖屏(宽高比 < 1)走手机版布局,横屏走 PC 布局。
|
|
// 嵌入竖屏 iframe(如游戏内客服)时由宿主容器形状决定,不受绝对宽度阈值影响
|
|
const w = document.documentElement.clientWidth || window.innerWidth
|
|
const h = document.documentElement.clientHeight || window.innerHeight
|
|
|
|
if (h > 0 && w / h < 1) {
|
|
const css = 'calc(100vw/7.5)'
|
|
document.documentElement.style.fontSize = css;
|
|
this.setDevice('Mobile')
|
|
} else {
|
|
this.setDevice('Desktop')
|
|
}
|
|
}
|
|
},
|
|
mounted () {
|
|
on(window, 'resize', this.handleWindowResize)
|
|
this.handleMatchMedia()
|
|
},
|
|
beforeDestroy () {
|
|
off(window, 'resize', this.handleWindowResize)
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="less">
|
|
.size{
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
html,body{
|
|
.size;
|
|
overflow: hidden;
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
#app {
|
|
.size;
|
|
}
|
|
</style>
|