MoeJue/douyin
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

优化

Browse Source
This commit is contained in:
zyronon 2024-03-22 00:53:28 +08:00
parent 59fb656bd8
commit 1e4c4dc702
48 changed files with 1498 additions and 120 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
index.html
View File

@ -44,8 +44,10 @@
<script crossorigin="anonymous" <script crossorigin="anonymous"
integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ==" integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ=="
src="https://lib.baomitu.com/jquery/3.6.0/jquery.min.js"></script> src="https://lib.baomitu.com/jquery/3.6.0/jquery.min.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/eruda/3.0.1/eruda.min.js"></script> <!-- <script crossorigin="anonymous"-->
<!-- <script>eruda.init();</script>--> <!-- integrity="sha512-KkkY/3auRhaXDFzFMpwtZ+BrS8EBQ+GfiBxdJ9jGMi6Gg74/sYbq/IZpY593pkNjTmbeRfBwjpZo+7gcpH45Ww=="-->
<!-- src="https://lib.baomitu.com/eruda/3.0.1/eruda.min.js"></script>-->
<!-- <script>eruda.init();</script>-->
</head> </head>
<body> <body>
<div id="app"></div> <div id="app"></div>

20
src/App.vue
View File

@ -30,15 +30,14 @@ export default {
computed: { computed: {
...mapState(['excludeRoutes']), ...mapState(['excludeRoutes']),
}, },
methods: {},
// watch $route 决定使用哪种过渡 // watch $route 决定使用哪种过渡
watch: { watch: {
'$route'(to, from) { '$route'(to, from) {
this.$store.commit('setMaskDialog', {state: false, mode: this.maskDialogMode}) this.$store.commit('setMaskDialog', {state: false, mode: this.maskDialogMode})
//footer下面的5个按钮，对跳不要用动画 //footer下面的5个按钮，对跳不要用动画
let noAnimation = ['/', '/home','/slide', '/me', '/attention', '/message', '/publish', '/home/live', let noAnimation = ['/', '/home', '/slide', '/me', '/attention', '/message', '/publish', '/home/live',
'slide' 'slide'
] ]
if (noAnimation.indexOf(from.path) !== -1 && noAnimation.indexOf(to.path) !== -1) { if (noAnimation.indexOf(from.path) !== -1 && noAnimation.indexOf(to.path) !== -1) {
return this.transitionName = '' return this.transitionName = ''
@ -49,9 +48,21 @@ export default {
this.transitionName = toDepth > fromDepth ? 'go' : 'back' this.transitionName = toDepth > fromDepth ? 'go' : 'back'
}, },
}, },
methods: {
setVh() {
let vh = window.innerHeight * 0.01
document.documentElement.style.setProperty('--vh', `${vh}px`)
}
},
mounted() { mounted() {
this.setVh()
// 监听resize事件 视图大小发生变化就重新计算1vh的值
window.addEventListener('resize', () => {
// location.reload()
this.setVh()
})
// window.onresize = () => { // window.onresize = () => {
// location.reload() //
// } // }
// this.$store.dispatch('getFriends') // this.$store.dispatch('getFriends')
try { try {
@ -64,6 +75,7 @@ export default {
} }
document.onselectstart = new Function("return false")//禁止选中文字 document.onselectstart = new Function("return false")//禁止选中文字
}, },
} }
</script> </script>

1
src/assets/less/color.less
View File

@ -20,6 +20,5 @@
} }
//消息页面 //消息页面
@msg-bg: rgb(22,22,22);
@msg-subpage-card-bg: rgb(28, 30, 43); //二级页面，卡片背景 @msg-subpage-card-bg: rgb(28, 30, 43); //二级页面，卡片背景

6
src/assets/less/index.less
View File

@ -10,6 +10,12 @@
//布局 //布局
@import "anim"; @import "anim";
:root {
--color-me: rgb(21, 23, 35);
--color-user: rgb(22, 24, 36);
--color-message: rgb(21, 21, 21);
--home-header-height: 40rem;
}
html, body { html, body {
width: 100%; width: 100%;

2
src/assets/less/variables.less
View File

@ -1,5 +1,5 @@
@footer-height: 56rem; @footer-height: 56rem;
@header-height: 40rem; @header-height: 50rem;
@indicator-height: 43rem; @indicator-height: 43rem;
@padding-page: 15rem; @padding-page: 15rem;

1
src/components/BaseHeader.vue
View File

@ -78,7 +78,6 @@ export default {
.left { .left {
position: absolute; position: absolute;
left: 10rem; left: 10rem;
top: 20rem;
} }
& > :nth-last-child(1) { & > :nth-last-child(1) {

2
src/components/Call.vue
View File

@ -167,7 +167,7 @@ export default {
top: 0; top: 0;
left: 0; left: 0;
width: 100vw; width: 100vw;
height: 100vh; height: calc(var(--vh, 1vh) * 100);
background: linear-gradient(to bottom, #262626, black); background: linear-gradient(to bottom, #262626, black);
transition: all .3s; transition: all .3s;
font-size: 12rem; font-size: 12rem;

2
src/components/Comment.vue
View File

@ -152,7 +152,7 @@ export default {
}, },
height: { height: {
type: String, type: String,
default: '70vh' default: 'calc(var(--vh, 1vh) * 70)'
}, },
}, },
computed: { computed: {

2
src/components/Footer.vue
View File

@ -92,7 +92,7 @@ export default {
z-index: 2; z-index: 2;
//不用bottom：0是因为，在进行页面切换的时候，vue的transition //不用bottom：0是因为，在进行页面切换的时候，vue的transition
// 会使footer的bottom：0失效，不能准确定位 // 会使footer的bottom：0失效，不能准确定位
top: calc(100vh - @footer-height); top: calc(var(--vh, 1vh) * 100 - @footer-height);
//bottom: 0; //bottom: 0;
background: @footer-color; background: @footer-color;
color: white; color: white;

7
src/components/UserPanel.vue
View File

@ -186,6 +186,7 @@ import Posters from '@/components/Posters'
import {merge} from 'lodash-es' import {merge} from 'lodash-es'
import {DefaultUser} from "@/utils/const_var"; import {DefaultUser} from "@/utils/const_var";
import Loading from "@/components/Loading.vue"; import Loading from "@/components/Loading.vue";
import {FILE_URL} from "@/config";
const $nav = useNav() const $nav = useNav()
const store = useStore() const store = useStore()
@ -288,7 +289,7 @@ watch(() => props.active,
if (newVal && !props.currentItem.aweme_list.length) { if (newVal && !props.currentItem.aweme_list.length) {
// console.log('props.currentItem',props.currentItem) // console.log('props.currentItem',props.currentItem)
let id = _getUserDouyinId(props.currentItem) let id = _getUserDouyinId(props.currentItem)
fetch(`/data/user-${id}.json`).then(r => { fetch(`${FILE_URL}user-${id}.json`).then(r => {
r.json().then(l => { r.json().then(l => {
setTimeout(() => { setTimeout(() => {
emit('update:currentItem', merge(props.currentItem, {aweme_list: l})) emit('update:currentItem', merge(props.currentItem, {aweme_list: l}))
@ -397,7 +398,7 @@ function touchEnd(e) {
#UserPanel { #UserPanel {
position: fixed; position: fixed;
background: @main-bg; background: var(--color-user);
height: 100%; height: 100%;
width: 100%; width: 100%;
overflow: auto; overflow: auto;
@ -434,7 +435,7 @@ function touchEnd(e) {
top: 0; top: 0;
left: 0; left: 0;
width: 100vw; width: 100vw;
height: 100vh; height: calc(var(--vh, 1vh) * 100);
z-index: 3; z-index: 3;
} }

2
src/components/dialog/FromBottomDialog.vue
View File

@ -49,7 +49,7 @@ export default {
}, },
height: { height: {
type: String, type: String,
default: '70vh' default: 'calc(var(--vh, 1vh) * 70)'
}, },
showHengGang: { showHengGang: {
type: Boolean, type: Boolean,

16
src/components/slide/BVideo.vue
View File

@ -8,8 +8,15 @@
ref="video" ref="video"
muted muted
preload preload
loop
x5-video-player-type="h5-page"
:x5-video-player-fullscreen='false'
:webkit-playsinline="true"
:x5-playsinline="true"
:playsinline="true" :playsinline="true"
:autoplay="isPlay" loop> :fullscreen="false"
:autoplay="isPlay"
>
<p> 您的浏览器不支持 video 标签。</p> <p> 您的浏览器不支持 video 标签。</p>
</video> </video>
<Icon icon="fluent:play-28-filled" class="pause-icon" v-if="!isPlaying"/> <Icon icon="fluent:play-28-filled" class="pause-icon" v-if="!isPlaying"/>
@ -253,7 +260,7 @@ export default {
onDialogMove({tag, e}) { onDialogMove({tag, e}) {
if (this.commentVisible && tag === 'comment') { if (this.commentVisible && tag === 'comment') {
Utils.$setCss(this.$refs.video, 'transition-duration', `0ms`) Utils.$setCss(this.$refs.video, 'transition-duration', `0ms`)
Utils.$setCss(this.$refs.video, 'height', `calc(30vh + ${e}px)`) Utils.$setCss(this.$refs.video, 'height', `calc(var(--vh, 1vh) * 30 + ${e}px)`)
} }
}, },
onDialogEnd({tag, isClose}) { onDialogEnd({tag, isClose}) {
@ -264,14 +271,14 @@ export default {
this.commentVisible = false this.commentVisible = false
Utils.$setCss(this.$refs.video, 'height', '100%') Utils.$setCss(this.$refs.video, 'height', '100%')
} else { } else {
Utils.$setCss(this.$refs.video, 'height', '30vh') Utils.$setCss(this.$refs.video, 'height', 'calc(var(--vh, 1vh) * 30)')
} }
} }
}, },
onOpenComments(id) { onOpenComments(id) {
if (id === this.item.id) { if (id === this.item.id) {
Utils.$setCss(this.$refs.video, 'transition-duration', `300ms`) Utils.$setCss(this.$refs.video, 'transition-duration', `300ms`)
Utils.$setCss(this.$refs.video, 'height', '30vh') Utils.$setCss(this.$refs.video, 'height', 'calc(var(--vh, 1vh) * 30)')
this.commentVisible = true this.commentVisible = true
} }
}, },
@ -369,6 +376,7 @@ export default {
text-align: center; text-align: center;
video { video {
max-width: 100vw;
height: 100%; height: 100%;
transition: height, margin-top .3s; transition: height, margin-top .3s;
//background: black; //background: black;

13
src/config/index.js
View File

@ -1,8 +1,15 @@
export default { export default {
baseUrl: 'http://192.168.0.103/index.php/v1', baseUrl: 'https://dy.ttentau.top/imgs/',
filePreview:'http://192.168.0.103/static/uploads/', imgPath: '/imgs/',
filePreview: 'http://192.168.0.103/static/uploads/',
// baseUrl: 'http://192.168.10.164/index.php/v1', // baseUrl: 'http://192.168.10.164/index.php/v1',
// filePreview:'http://192.168.10.164/static/uploads/' // filePreview:'http://192.168.10.164/static/uploads/'
// baseUrl: 'http://localhost/index.php/v1', // baseUrl: 'http://localhost/index.php/v1',
// filePreview:'http://localhost/static/uploads/' // filePreview:'http://localhost/static/uploads/'
} }
// export const BASE_URL = 'https://dy.ttentau.top'
export const BASE_URL = ''
export const IMG_URL = BASE_URL + '/imgs/'
export const FILE_URL = BASE_URL + '/data/'

2
src/pages/home/Attention.vue
View File

@ -289,7 +289,7 @@ onMounted(() => {
.Scroll { .Scroll {
position: relative; position: relative;
z-index: 2; z-index: 2;
height: calc(100vh - @footer-height * 2) !important; height: calc(var(--vh, 1vh) * 100 - @footer-height * 2) !important;
} }
.fixed { .fixed {

8
src/pages/home/LivePage.vue
View File

@ -408,19 +408,19 @@ export default {
.LivePage { .LivePage {
width: 100vw; width: 100vw;
height: 100vh; height: calc(var(--vh, 1vh) * 100);
color: white; color: white;
font-size: 14rem; font-size: 14rem;
position: relative; position: relative;
.live-wrapper { .live-wrapper {
width: 100vw; width: 100vw;
height: 100vh; height: calc(var(--vh, 1vh) * 100);
background: black; background: black;
img { img {
width: 100vw; width: 100vw;
height: 100vh; height: calc(var(--vh, 1vh) * 100);
color: rgb(229, 229, 229); color: rgb(229, 229, 229);
} }
} }
@ -429,7 +429,7 @@ export default {
position: absolute; position: absolute;
top: 0; top: 0;
width: 100vw; width: 100vw;
height: 100vh; height: calc(var(--vh, 1vh) * 100);
@tag-bg: rgba(58, 58, 70, 0.3); @tag-bg: rgba(58, 58, 70, 0.3);

2
src/pages/home/Music.vue
View File

@ -279,7 +279,7 @@ export default {
padding-top: 60rem; padding-top: 60rem;
.Scroll { .Scroll {
height: calc(100vh - 60rem); height: calc(var(--vh, 1vh) * 100 - 60rem);
} }
.desc { .desc {

4
src/pages/home/components/IndicatorHome.vue
View File

@ -202,7 +202,7 @@ export default {
z-index: 2; z-index: 2;
width: 100%; width: 100%;
color: white; color: white;
height: @header-height; height: var(--home-header-height);
transition: all .3s; transition: all .3s;
font-weight: bold; font-weight: bold;
@ -352,7 +352,7 @@ export default {
top: 0; top: 0;
position: absolute; position: absolute;
width: 100vw; width: 100vw;
height: 100vh; height: calc(var(--vh, 1vh) * 100);
background: #00000066; background: #00000066;
} }
} }

2
src/pages/home/components/ShareToFriend.vue
View File

@ -10,7 +10,7 @@
<div class="create-chat" v-show="!showJoinedChat"> <div class="create-chat" v-show="!showJoinedChat">
<Search <Search
:isShowRightText="isShowRightText" :isShowRightText="isShowRightText"
@click="isShowRightText = true;height = '100vh';" @click="isShowRightText = true;height = 'calc(var(--vh, 1vh) * 100)';"
@notice="isShowRightText = false;searchKey = '';height = '70vh';" @notice="isShowRightText = false;searchKey = '';height = '70vh';"
rightText="取消" rightText="取消"
rightTextColor="gray" rightTextColor="gray"

39
src/pages/home/index.vue
View File

@ -101,22 +101,21 @@
@showSlidebar="state.baseIndex = 0" @showSlidebar="state.baseIndex = 0"
v-model:index="state.navIndex" v-model:index="state.navIndex"
/> />
<div class="slide-content"> <SlideHorizontal class="first-horizontal-item"
<SlideHorizontal class="first-horizontal-item" name="main"
name="main" :change-active-index-use-anim="false"
:change-active-index-use-anim="false" v-model:index="state.navIndex">
v-model:index="state.navIndex"> <Slide0 :active="state.navIndex === 0 && state.baseIndex === 1"/>
<Slide0 :active="state.navIndex === 0 && state.baseIndex === 1"/> <SlideItem>
<SlideItem> <Community/>
<Community/> </SlideItem>
</SlideItem> <Slide2 :active="state.navIndex === 2 && state.baseIndex === 1"/>
<Slide2 :active="state.navIndex === 2 && state.baseIndex === 1"/> <SlideItem>
<SlideItem> <LongVideo :active="state.navIndex === 3 && state.baseIndex === 1"/>
<LongVideo :active="state.navIndex === 3 && state.baseIndex === 1"/> </SlideItem>
</SlideItem> <Slide4 :active="state.navIndex === 4 && state.baseIndex === 1"/>
<Slide4 :active="state.navIndex === 4 && state.baseIndex === 1"/> </SlideHorizontal>
</SlideHorizontal>
</div>
<Footer v-bind:init-tab="1"/> <Footer v-bind:init-tab="1"/>
<Mask v-if="state.baseIndex === 0" <Mask v-if="state.baseIndex === 0"
@click="state.baseIndex = 1" @click="state.baseIndex = 1"
@ -135,7 +134,6 @@
</SlideItem> </SlideItem>
</SlideHorizontal> </SlideHorizontal>
<Comment page-id="home-index" v-model="state.commentVisible" <Comment page-id="home-index" v-model="state.commentVisible"
@close="closeComments" @close="closeComments"
/> />
@ -315,11 +313,12 @@ function dislike() {
font-size: 14rem; font-size: 14rem;
width: 100%; width: 100%;
height: 100%; height: 100%;
background: black;
overflow: hidden; overflow: hidden;
.sidebar { .sidebar {
width: 80vw; width: 80vw;
height: 100vh; height: calc(var(--vh, 1vh) * 100);
overflow: auto; overflow: auto;
background: rgb(22, 22, 22); background: rgb(22, 22, 22);
padding: 10rem; padding: 10rem;
@ -422,9 +421,9 @@ function dislike() {
//width: 90vw; //width: 90vw;
//height: 80vh; //height: 80vh;
width: 100vw; width: 100vw;
height: calc(100vh - @footer-height) !important; height: calc(var(--vh, 1vh) * 100 - @footer-height) !important;
overflow: hidden; overflow: hidden;
border-radius: 10rem;
} }
</style> </style>

1389
src/pages/home/slide/Community.vue
View File

File diff suppressed because it is too large Load Diff

2
src/pages/home/slide/LongVideo.vue
View File

@ -107,7 +107,7 @@ onUnmounted(() => {
display: grid; display: grid;
grid-template-columns: repeat(2, 1fr); grid-template-columns: repeat(2, 1fr);
row-gap: 15rem; row-gap: 15rem;
height: calc(100vh - @header-height - @footer-height); height: calc(var(--vh, 1vh) * 100 - @header-height - @footer-height);
margin-top: @header-height; margin-top: @header-height;
overflow: auto; overflow: auto;
box-sizing: border-box; box-sizing: border-box;

2
src/pages/login/Help.vue
View File

@ -42,7 +42,7 @@ export default {
.content { .content {
margin-top: 60rem; margin-top: 60rem;
height: calc(100vh - 60rem); height: calc(var(--vh, 1vh) * 100 - 60rem);
iframe { iframe {
padding: 0; padding: 0;

2
src/pages/login/countryChoose.vue
View File

@ -2447,7 +2447,7 @@ export default {
.indicator-ctn { .indicator-ctn {
width: 25rem; width: 25rem;
height: 100vh; height: calc(var(--vh, 1vh) * 100);
position: fixed; position: fixed;
z-index: 3; z-index: 3;
top: 0; top: 0;

4
src/pages/me/Me.less
View File

@ -12,7 +12,7 @@
} }
.Me { .Me {
background: @main-bg; background: var(--color-me);
height: 100%; height: 100%;
width: 100%; width: 100%;
font-size: 14rem; font-size: 14rem;
@ -49,7 +49,7 @@
top: 0; top: 0;
left: 0; left: 0;
width: 100vw; width: 100vw;
height: 100vh; height: calc(var(--vh, 1vh) * 100);
z-index: 3; z-index: 3;
} }

2
src/pages/me/Me.vue
View File

@ -438,7 +438,7 @@ export default {
return this.$store.state.bodyWidth return this.$store.state.bodyWidth
}, },
videoSlideRowListStyle() { videoSlideRowListStyle() {
return {height: this.refs.videoSlideHeight !== 0 ? this.refs.videoSlideHeight + 'px' : 'calc(100vh - 146rem)'} return {height: this.refs.videoSlideHeight !== 0 ? this.refs.videoSlideHeight + 'px' : 'calc(var(--vh, 1vh) * 100 - 146rem)'}
}, },
SlideItemStyle() { SlideItemStyle() {
if (this.tempScroll || this.isScroll) return {overflow: 'auto'} if (this.tempScroll || this.isScroll) return {overflow: 'auto'}

4
src/pages/me/MyMusic.vue
View File

@ -431,7 +431,7 @@ export default {
position: fixed; position: fixed;
z-index: 11; z-index: 11;
width: 100vw; width: 100vw;
height: 100vh; height: calc(var(--vh, 1vh) * 100);
top: 0; top: 0;
background: rgb(136, 132, 133); background: rgb(136, 132, 133);
@ -463,7 +463,7 @@ export default {
.my-collect-dialog-enter-from, .my-collect-dialog-enter-from,
.my-collect-dialog-leave-to { .my-collect-dialog-leave-to {
transition-duration: 300ms; transition-duration: 300ms;
transform: translateY(100vh); transform: translateY(calc(var(--vh, 1vh) * 100));
} }
.float-play-enter-active, .float-play-enter-active,

2
src/pages/me/Uploader.less
View File

@ -54,7 +54,7 @@
top: 0; top: 0;
left: 0; left: 0;
width: 100vw; width: 100vw;
height: 100vh; height: calc(var(--vh, 1vh) * 100);
z-index: 3; z-index: 3;
} }

2
src/pages/me/Uploader.vue
View File

@ -324,7 +324,7 @@ export default {
return this.$store.state.bodyWidth return this.$store.state.bodyWidth
}, },
videoSlideRowListStyle() { videoSlideRowListStyle() {
return {height: this.refs.videoSlideHeight !== 0 ? this.refs.videoSlideHeight + 'px' : 'calc(100vh - 96rem)'} return {height: this.refs.videoSlideHeight !== 0 ? this.refs.videoSlideHeight + 'px' : 'calc(var(--vh, 1vh) * 100 - 96rem)'}
}, },
SlideItemStyle() { SlideItemStyle() {
if (this.tempScroll || this.isScroll) return {overflow: 'auto'} if (this.tempScroll || this.isScroll) return {overflow: 'auto'}

2
src/pages/me/VideoDetail.vue
View File

@ -186,7 +186,7 @@ onMounted(() => {
} }
.content { .content {
height: calc(100vh - @footer-height); height: calc(var(--vh, 1vh) * 100 - @footer-height);
} }
.footer { .footer {

2
src/pages/me/collect/VideoCollect.vue
View File

@ -77,7 +77,7 @@ export default {
padding-top: @header-height; padding-top: @header-height;
.Scroll { .Scroll {
height: calc(100vh - @header-height)!important; height: calc(var(--vh, 1vh) * 100 - @header-height)!important;
} }
} }
} }

2
src/pages/me/components/CollectMusic.vue
View File

@ -161,7 +161,7 @@ export default {
#CollectMusic { #CollectMusic {
//width: 100vw; //width: 100vw;
//height: 100vh; //height: calc(var(--vh, 1vh) * 100);
position: fixed; position: fixed;
left: 0; left: 0;
right: 0; right: 0;

2
src/pages/me/components/GuessMusic.vue
View File

@ -143,7 +143,7 @@ export default {
#GuessMusic { #GuessMusic {
//width: 100vw; //width: 100vw;
//height: 100vh; //height: calc(var(--vh, 1vh) * 100);
position: fixed; position: fixed;
left: 0; left: 0;
right: 0; right: 0;

2
src/pages/me/rightMenu/LookHistory.vue
View File

@ -148,7 +148,7 @@ export default {
padding-top: 60rem; padding-top: 60rem;
.SlideRowList, .Scroll { .SlideRowList, .Scroll {
height: calc(100vh - @indicator-height - @header-height) !important; height: calc(var(--vh, 1vh) * 100 - @indicator-height - @header-height) !important;
} }
.empty { .empty {

6
src/pages/message/AllMessage.vue
View File

@ -249,7 +249,7 @@ export default {
.type-dialog { .type-dialog {
z-index: 9; z-index: 9;
position: fixed; position: fixed;
height: 100vh; height: calc(var(--vh, 1vh) * 100);
width: 100vw; width: 100vw;
margin-top: @header-height; margin-top: @header-height;
@ -264,7 +264,7 @@ export default {
.mask { .mask {
z-index: 8; z-index: 8;
position: fixed; position: fixed;
height: 100vh; height: calc(var(--vh, 1vh) * 100);
width: 100vw; width: 100vw;
background: @mask-dark; background: @mask-dark;
} }
@ -275,7 +275,7 @@ export default {
padding-top: @header-height; padding-top: @header-height;
.scroll { .scroll {
height: calc(100vh - @header-height); height: calc(var(--vh, 1vh) * 100 - @header-height);
} }
.messages { .messages {

2
src/pages/message/Fans.vue
View File

@ -109,7 +109,7 @@ export default {
padding-top: @header-height; padding-top: @header-height;
.scroll { .scroll {
height: calc(100vh - @header-height); height: calc(var(--vh, 1vh) * 100 - @header-height);
} }
.people-wrapper { .people-wrapper {

8
src/pages/message/Message.vue
View File

@ -502,11 +502,11 @@ export default {
left: 0; left: 0;
right: 0; right: 0;
font-size: 14rem; font-size: 14rem;
background: @msg-bg; background: var(--color-message);
color: white; color: white;
.no-search { .no-search {
height: 100vh; height: calc(var(--vh, 1vh) * 100);
> header { > header {
padding: 0 20rem; padding: 0 20rem;
@ -515,10 +515,8 @@ export default {
align-items: center; align-items: center;
height: @header-height; height: @header-height;
box-sizing: border-box; box-sizing: border-box;
border-bottom: 1px solid #cccccc11;
position: relative; position: relative;
font-size: 24rem; font-size: 24rem;
} }
.create-chat-wrapper { .create-chat-wrapper {
@ -949,7 +947,7 @@ export default {
top: 0; top: 0;
left: 0; left: 0;
width: 100vw; width: 100vw;
height: 100vh; height: calc(var(--vh, 1vh) * 100);
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;

2
src/pages/message/Share2Friend.vue
View File

@ -392,7 +392,7 @@ export default {
.indicator-ctn { .indicator-ctn {
width: 25rem; width: 25rem;
height: 100vh; height: calc(var(--vh, 1vh) * 100);
top: 0; top: 0;
position: fixed; position: fixed;
z-index: 3; z-index: 3;

12
src/pages/message/chat/Chat.vue
View File

@ -540,7 +540,7 @@ export default {
overflow: auto; overflow: auto;
color: white; color: white;
font-size: 14rem; font-size: 14rem;
background: @msg-bg; background: var(--color-message);
.chat-content { .chat-content {
> .header { > .header {
@ -582,11 +582,11 @@ export default {
} }
.message-wrapper { .message-wrapper {
height: calc(100vh - 125rem); height: calc(var(--vh, 1vh) * 100 - 125rem);
overflow: auto; overflow: auto;
&.expand { &.expand {
height: calc(100vh - (125rem + 30vh)); height: calc(var(--vh, 1vh) * 100 - (125rem + var(--vh, 1vh) * 30));
} }
} }
@ -654,7 +654,7 @@ export default {
font-size: 14rem; font-size: 14rem;
width: 100vw; width: 100vw;
padding: 15rem; padding: 15rem;
height: 30vh; height: calc(var(--vh, 1vh) * 30);
box-sizing: border-box; box-sizing: border-box;
.option-wrapper { .option-wrapper {
@ -690,7 +690,7 @@ export default {
top: 0; top: 0;
background: black; background: black;
width: 100vw; width: 100vw;
height: 100vh; height: calc(var(--vh, 1vh) * 100);
.header { .header {
position: fixed; position: fixed;
@ -758,7 +758,7 @@ export default {
top: 0; top: 0;
position: fixed; position: fixed;
width: 100vw; width: 100vw;
height: 100vh; height: calc(var(--vh, 1vh) * 100);
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;

2
src/pages/message/notice/DouyinHelper.vue
View File

@ -116,7 +116,7 @@ export default {
font-size: 14rem; font-size: 14rem;
.scroll { .scroll {
height: calc(100vh - @header-height); height: calc(var(--vh, 1vh) * 100 - @header-height);
} }
.content { .content {

4
src/pages/message/notice/LiveNotice.vue
View File

@ -92,11 +92,11 @@ export default {
font-size: 14rem; font-size: 14rem;
.scroll { .scroll {
height: calc(100vh - @header-height); height: calc(var(--vh, 1vh) * 100 - @header-height);
} }
.content { .content {
height: calc(100vh - @header-height); height: calc(var(--vh, 1vh) * 100 - @header-height);
.list { .list {
padding: @padding-page; padding: @padding-page;

4
src/pages/message/notice/MoneyNotice.vue
View File

@ -138,11 +138,11 @@ export default {
font-size: 14rem; font-size: 14rem;
.scroll { .scroll {
height: calc(100vh - @header-height); height: calc(var(--vh, 1vh) * 100 - @header-height);
} }
.content { .content {
height: calc(100vh - @header-height); height: calc(var(--vh, 1vh) * 100 - @header-height);
.list { .list {
padding: @padding-page; padding: @padding-page;

4
src/pages/message/notice/SystemNotice.vue
View File

@ -163,11 +163,11 @@ export default {
font-size: 14rem; font-size: 14rem;
.scroll { .scroll {
height: calc(100vh - @header-height - @header-height); height: calc(var(--vh, 1vh) * 100 - @header-height - @header-height);
} }
.content { .content {
height: calc(100vh - @header-height); height: calc(var(--vh, 1vh) * 100 - @header-height);
padding: @padding-page; padding: @padding-page;
padding-top: 0; padding-top: 0;
box-sizing: border-box; box-sizing: border-box;

4
src/pages/message/notice/TaskNotice.vue
View File

@ -145,11 +145,11 @@ export default {
font-size: 14rem; font-size: 14rem;
.scroll { .scroll {
height: calc(100vh - @header-height - @header-height); height: calc(var(--vh, 1vh) * 100 - @header-height - @header-height);
} }
.content { .content {
height: calc(100vh - @header-height); height: calc(var(--vh, 1vh) * 100 - @header-height);
.list { .list {
padding: @padding-page; padding: @padding-page;

2
src/pages/people/FollowAndFans.vue
View File

@ -19,7 +19,7 @@
v-model:active-index="slideIndex"> v-model:active-index="slideIndex">
</Indicator> </Indicator>
</div> </div>
<SlideHorizontal v-model:index="slideIndex" style="height: calc(100vh - 111rem)"> <SlideHorizontal v-model:index="slideIndex" style="height: calc(var(--vh, 1vh) * 100 - 111rem)">
<SlideItem class="tab1"> <SlideItem class="tab1">
<Search v-model="searchKey" placeholder="搜索用户备注或名字" :is-show-right-text="false"/> <Search v-model="searchKey" placeholder="搜索用户备注或名字" :is-show-right-text="false"/>
<div class="is-search" v-if="searchKey"> <div class="is-search" v-if="searchKey">

4
src/pages/people/Scan.vue
View File

@ -95,11 +95,11 @@ export default {
} }
.video-ctn { .video-ctn {
height: 100vh; height: calc(var(--vh, 1vh) * 100);
width: 100vw; width: 100vw;
video { video {
height: 100vh; height: calc(var(--vh, 1vh) * 100);
width: 100vw; width: 100vw;
} }
} }

2
src/pages/shop/Shop.vue
View File

@ -285,7 +285,7 @@ onMounted(() => {
.Scroll { .Scroll {
position: relative; position: relative;
z-index: 2; z-index: 2;
height: calc(100vh - @footer-height * 2) !important; height: calc(var(--vh, 1vh) * 100 - @footer-height * 2) !important;
} }
.fixed { .fixed {

2
src/pages/test/Test.vue
View File

@ -32,7 +32,7 @@ export default {
justify-content: center; justify-content: center;
padding: 0; padding: 0;
margin: 0; margin: 0;
height: 100vh; height: calc(var(--vh, 1vh) * 100);
width: 100vw; width: 100vw;
overflow: hidden; overflow: hidden;
transform-origin: 0 0; transform-origin: 0 0;

4
src/utils/index.jsx
View File

@ -3,7 +3,7 @@ import SelectDialog from "../components/dialog/SelectDialog";
import SimpleConfirmDialog from "../components/dialog/SimpleConfirmDialog"; import SimpleConfirmDialog from "../components/dialog/SimpleConfirmDialog";
import ConfirmDialog from "../components/dialog/ConfirmDialog"; import ConfirmDialog from "../components/dialog/ConfirmDialog";
import Loading from "../components/Loading.vue"; import Loading from "../components/Loading.vue";
import Config from '../config' import Config, {IMG_URL} from '../config'
import NoticeDialog from "../components/dialog/NoticeDialog"; import NoticeDialog from "../components/dialog/NoticeDialog";
import dayjs from 'dayjs' import dayjs from 'dayjs'
import bus, {EVENT_KEY} from "./bus"; import bus, {EVENT_KEY} from "./bus";
@ -446,7 +446,7 @@ export function _checkImgUrl(url) {
if (url.includes('http')) { if (url.includes('http')) {
return url return url
} else { } else {
return '/imgs/' + url return IMG_URL + url
} }
} }