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

View File

@ -44,8 +44,10 @@
<script crossorigin="anonymous"
integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ=="
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>eruda.init();</script>-->
<!-- <script crossorigin="anonymous"-->
<!-- 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>
<body>
<div id="app"></div>

View File

@ -30,15 +30,14 @@ export default {
computed: {
...mapState(['excludeRoutes']),
},
methods: {},
// watch $route 使
watch: {
'$route'(to, from) {
this.$store.commit('setMaskDialog', {state: false, mode: this.maskDialogMode})
//footer5
let noAnimation = ['/', '/home','/slide', '/me', '/attention', '/message', '/publish', '/home/live',
'slide'
let noAnimation = ['/', '/home', '/slide', '/me', '/attention', '/message', '/publish', '/home/live',
'slide'
]
if (noAnimation.indexOf(from.path) !== -1 && noAnimation.indexOf(to.path) !== -1) {
return this.transitionName = ''
@ -49,9 +48,21 @@ export default {
this.transitionName = toDepth > fromDepth ? 'go' : 'back'
},
},
methods: {
setVh() {
let vh = window.innerHeight * 0.01
document.documentElement.style.setProperty('--vh', `${vh}px`)
}
},
mounted() {
this.setVh()
// resize 1vh
window.addEventListener('resize', () => {
// location.reload()
this.setVh()
})
// window.onresize = () => {
// location.reload()
//
// }
// this.$store.dispatch('getFriends')
try {
@ -64,6 +75,7 @@ export default {
}
document.onselectstart = new Function("return false")//
},
}
</script>

View File

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

View File

@ -10,6 +10,12 @@
//布局
@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 {
width: 100%;

View File

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

View File

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

View File

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

View File

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

View File

@ -92,7 +92,7 @@ export default {
z-index: 2;
//bottom0vuetransition
// 使footerbottom0
top: calc(100vh - @footer-height);
top: calc(var(--vh, 1vh) * 100 - @footer-height);
//bottom: 0;
background: @footer-color;
color: white;

View File

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

View File

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

View File

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

View File

@ -1,8 +1,15 @@
export default {
baseUrl: 'http://192.168.0.103/index.php/v1',
filePreview:'http://192.168.0.103/static/uploads/',
baseUrl: 'https://dy.ttentau.top/imgs/',
imgPath: '/imgs/',
filePreview: 'http://192.168.0.103/static/uploads/',
// baseUrl: 'http://192.168.10.164/index.php/v1',
// filePreview:'http://192.168.10.164/static/uploads/'
// baseUrl: 'http://localhost/index.php/v1',
// 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/'

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

File diff suppressed because it is too large Load Diff

View File

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

View File

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

View File

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

View File

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

View File

@ -438,7 +438,7 @@ export default {
return this.$store.state.bodyWidth
},
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() {
if (this.tempScroll || this.isScroll) return {overflow: 'auto'}

View File

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

View File

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

View File

@ -324,7 +324,7 @@ export default {
return this.$store.state.bodyWidth
},
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() {
if (this.tempScroll || this.isScroll) return {overflow: 'auto'}

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

@ -19,7 +19,7 @@
v-model:active-index="slideIndex">
</Indicator>
</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">
<Search v-model="searchKey" placeholder="搜索用户备注或名字" :is-show-right-text="false"/>
<div class="is-search" v-if="searchKey">

View File

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

View File

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

View File

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

View File

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