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

debug

Browse Source
This commit is contained in:
zyronon 2021-10-19 23:27:35 +08:00
parent 5407471e65
commit dcceb5f548
9 changed files with 817 additions and 878 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
src/components/Search.vue
View File

@ -5,11 +5,11 @@
<input type="text" :placeholder="placeholder" v-model="value"> <input type="text" :placeholder="placeholder" v-model="value">
<div class="suffix"> <div class="suffix">
<slot v-if="$slots.default"></slot> <slot v-if="$slots.default"></slot>
<img v-if="value.length && (!$slots.default)" src="../assets/img/icon/login/close-full-gray.png" <img v-if="value.length && (!$slots.default)" src="../assets/img/icon/components/gray-close-full2.png"
@click.stop="clear"> @click.stop="clear">
</div> </div>
</div> </div>
<div v-if="isShowText" class="notice" :style="{color : notice}" @click.stop="$emit('notice')">{{ showText }}</div> <div v-if="isShowRightText" class="rightTextColor" :style="{color : rightTextColor}" @click.stop="$emit('notice')">{{ rightText }}</div>
</div> </div>
</template> </template>
@ -26,11 +26,11 @@ export default {
type: String, type: String,
default: '' default: ''
}, },
notice: { rightTextColor: {
type: String, type: String,
default: 'red' default: 'red'
}, },
isShowText: { isShowRightText: {
type: Boolean, type: Boolean,
default: false default: false
}, },
@ -38,7 +38,7 @@ export default {
type: Boolean, type: Boolean,
default: true default: true
}, },
showText: { rightText: {
type: String, type: String,
default: '搜索' default: '搜索'
}, },
@ -93,7 +93,7 @@ export default {
} }
} }
.notice { .rightTextColor {
margin-left: 1.5rem; margin-left: 1.5rem;
font-size: 1.6rem; font-size: 1.6rem;
} }
@ -130,11 +130,13 @@ export default {
} }
.suffix { .suffix {
display: flex;
align-items: center;
position: absolute; position: absolute;
right: 2rem; right: 1.5rem;
img { img {
width: 1rem; width: 1.5rem;
} }
} }
} }

4
src/pages/home/SearchPage.vue
View File

@ -3,8 +3,8 @@
<div class="header"> <div class="header">
<back mode="light" @click="$back" class="mr1r"></back> <back mode="light" @click="$back" class="mr1r"></back>
<BSearch placeholder="搜索用户名字/抖音号" <BSearch placeholder="搜索用户名字/抖音号"
:isShowText="true" :isShowRightText="true"
notice="white" rightTextColor="white"
@notice="$no" @notice="$no"
> >
<img class="scan" src="../../assets/img/icon/scan-gray.png" @click.stop="$nav('/scan')"> <img class="scan" src="../../assets/img/icon/scan-gray.png" @click.stop="$nav('/scan')">

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

@ -8,11 +8,11 @@
<div class="content" :style="{minHeight:height}"> <div class="content" :style="{minHeight:height}">
<div class="create-chat" v-show="!showJoinedChat"> <div class="create-chat" v-show="!showJoinedChat">
<Search <Search
:isShowText="isShowText" :isShowRightText="isShowRightText"
@click="isShowText = true;height = '100vh';" @click="isShowRightText = true;height = '100vh';"
@notice="isShowText = false;height = '70vh';" @notice="isShowRightText = false;height = '70vh';"
showText="取消" rightText="取消"
notice="gray" rightTextColor="gray"
placeholder="搜索" placeholder="搜索"
v-model="searchKey"/> v-model="searchKey"/>
<template v-if="searchKey"> <template v-if="searchKey">
@ -119,7 +119,7 @@ export default {
return { return {
height: '70vh', height: '70vh',
showJoinedChat: false, showJoinedChat: false,
isShowText: false, isShowRightText: false,
text: 'AAAAAAA、BBBBBBBB、CCCCCCCCCCCCC', text: 'AAAAAAA、BBBBBBBB、CCCCCCCCCCCCC',
localFriends: [], localFriends: [],
searchResult: [], searchResult: [],
@ -145,7 +145,7 @@ export default {
} else { } else {
this.searchKey = '' this.searchKey = ''
this.height = '70vh' this.height = '70vh'
this.isShowText = false this.isShowRightText = false
this.showJoinedChat = false this.showJoinedChat = false
} }
} }

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

@ -3,11 +3,11 @@
<base-header> <base-header>
<template v-slot:center>切换城市</template> <template v-slot:center>切换城市</template>
<template v-slot:bottom> <template v-slot:bottom>
<Search :isShowText="isShowText" <Search :isShowRightText="isShowRightText"
showText="取消" rightText="取消"
@click="isShowText = true" @click="isShowRightText = true"
@notice="isShowText = false;" @notice="isShowRightText = false;"
@clear="isShowText = false" @clear="isShowRightText = false"
class="ml2r mr2r mt1r" placeholder="输入城市或区县名搜索" v-model="searchKey"></Search> class="ml2r mr2r mt1r" placeholder="输入城市或区县名搜索" v-model="searchKey"></Search>
</template> </template>
</base-header> </base-header>
@ -2325,7 +2325,7 @@ export default {
] ]
}, },
history: [], history: [],
isShowText: false, isShowRightText: false,
searchKey: '', searchKey: '',
indexOffsetTop: {}, indexOffsetTop: {},
// currentFixedIndicator: null, // currentFixedIndicator: null,

2
src/pages/me/userinfo/ChooseSchool.vue
View File

@ -11,7 +11,7 @@
<Search class="mt1r mb1r ml2r mr2r" placeholder="搜索大学名称" <Search class="mt1r mb1r ml2r mr2r" placeholder="搜索大学名称"
v-model="schoolName" v-model="schoolName"
@clear="isSearch = false" @clear="isSearch = false"
:is-show-text="true" :is-show-right-text="true"
@notice="search"></Search> @notice="search"></Search>
</template> </template>
</BaseHeader> </BaseHeader>

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

@ -1,12 +1,17 @@
<template> <template>
<div id="Message" ref="app" :class="createChatDialog?'disable-scroll':''"> <div id="Message" ref="app" :class="createChatDialog?'disable-scroll':''">
<div class="header"> <div class="no-search" v-show="false">
<span style="opacity: 0;">消息</span> <BaseHeader>
<span class="f18">消息</span> <template v-slot:center>
<span class="f16">消息</span>
</template>
<template v-slot:right>
<span class="f14" @click="createChatDialog = true">创建群聊</span> <span class="f14" @click="createChatDialog = true">创建群聊</span>
</div> </template>
</BaseHeader>
<div class="content"> <div class="content">
<Search class="m2r"></Search> <Search class="ml2r mr2r mb2r"></Search>
<div class="friends pl1r "> <div class="friends pl1r ">
<div class="friend pr1r pl1r" <div class="friend pr1r pl1r"
@click="$nav('/message/chat')" @click="$nav('/message/chat')"
@ -250,10 +255,10 @@
<Footer v-bind:init-tab="4"/> <Footer v-bind:init-tab="4"/>
<from-bottom-dialog page-id="Message" v-model="createChatDialog"> <from-bottom-dialog page-id="Message" v-model="createChatDialog">
<div class="create-chat-wrapper" v-show="!showJoinedChat"> <div class="create-chat-wrapper" v-show="!showJoinedChat">
<Search :isShowText="isShowText" <Search :isShowRightText="isShowRightText"
@click="isShowText = true" @click="isShowRightText = true"
@notice="isShowText = false;" @notice="isShowRightText = false;"
@clear="isShowText = false" @clear="isShowRightText = false"
class="ml2r mr2r" placeholder="搜索用户" v-model="createChatSearchKey"></Search> class="ml2r mr2r" placeholder="搜索用户" v-model="createChatSearchKey"></Search>
<template v-if="createChatSearchKey"> <template v-if="createChatSearchKey">
<div class="search-result" v-if="searchFriends.length"> <div class="search-result" v-if="searchFriends.length">
@ -353,6 +358,19 @@
</div> </div>
</transition> </transition>
</div> </div>
<div class="searching">
<Search class="m2r" v-model="searchKey"
show-text="取消"
:isShowRightText="true"/>
<div class="more-chat">
</div>
</div>
</div>
</template> </template>
<script> <script>
@ -379,11 +397,12 @@ export default {
data() { data() {
return { return {
isShowRecommend: false, isShowRecommend: false,
searchKey: '',
createChatSearchKey: '', createChatSearchKey: '',
showJoinedChat: false, showJoinedChat: false,
loading: false, loading: false,
createChatDialog: false, createChatDialog: false,
isShowText: false, isShowRightText: false,
text: 'AAAAAAAAA、BBBBBBBBBBBBB、CCCCCCCC', text: 'AAAAAAAAA、BBBBBBBBBBBBB、CCCCCCCC',
// friends: [ // friends: [
// { // {
@ -465,9 +484,9 @@ export default {
}) })
}, },
mounted() { mounted() {
setTimeout(()=>{ setTimeout(() => {
// this.isShowRecommend = true // this.isShowRecommend = true
},1000) }, 1000)
}, },
methods: { methods: {
async loadRecommendData() { async loadRecommendData() {
@ -504,6 +523,8 @@ export default {
padding-bottom: 6rem; padding-bottom: 6rem;
color: white; color: white;
.no-search {
.create-chat-wrapper { .create-chat-wrapper {
min-height: 70vh; min-height: 70vh;
padding-bottom: 6rem; padding-bottom: 6rem;
@ -738,17 +759,12 @@ export default {
} }
} }
.header { /deep/ #BaseHeader .header {
position: fixed; border-bottom: none;
width: 100vw;
background: @main-bg; .left {
z-index: 11; opacity: 0;
height: 6rem; }
display: flex;
padding: @padding-page;
box-sizing: border-box;
align-items: center;
justify-content: space-between;
} }
.content { .content {
@ -945,91 +961,6 @@ export default {
} }
} }
.recommend {
.title {
padding: 2rem 2rem 1rem 2rem;
display: flex;
justify-content: space-between;
align-items: center;
.left {
color: @second-text-color;
img {
width: 1rem;
height: 1rem;
}
}
.right {
border-radius: 50%;
background: @second-text-color;
padding: .5rem;
width: 1rem;
height: 1rem;
}
}
.item {
display: flex;
align-items: center;
&.top {
background: #353a4f;
}
&:active {
background: #353a4f;
}
.head-image {
margin-left: 2rem;
margin-right: 1.5rem;
width: 4.8rem;
height: 4.8rem;
border-radius: 50%;
}
.content {
flex: 1;
display: flex;
justify-content: space-between;
padding: 1.5rem 0;
.left {
.name {
font-size: 1.8rem;
color: white;
}
.detail {
color: @second-text-color;
font-size: 1.2rem;
margin-top: 4px;
}
}
.right {
margin-right: 2rem;
display: flex;
align-items: center;
.button {
background: @primary-btn-color;
margin-left: .8rem;
padding: .8rem 2rem;
border-radius: .3rem;
&:nth-last-child(1) {
background: rgb(58, 58, 67);
}
}
}
}
}
}
.recommend-dialog { .recommend-dialog {
position: fixed; position: fixed;
z-index: 11; z-index: 11;
@ -1098,5 +1029,11 @@ export default {
} }
} }
} }
}
.searching {
}
} }
</style> </style>

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

@ -44,7 +44,7 @@
v-model="isShowSetting" v-model="isShowSetting"
mode="white" mode="white"
mask-mode="dark" mask-mode="dark"
height="25rem" height="27rem"
:show-heng-gang="false" :show-heng-gang="false"
> >
<div class="setting-dialog"> <div class="setting-dialog">

16
src/pages/people/FindAcquaintance.vue
View File

@ -13,16 +13,16 @@
<SlideRowList v-model:active-index="currentSlideItemIndex"> <SlideRowList v-model:active-index="currentSlideItemIndex">
<SlideItem class="tab1" style="overflow: auto;"> <SlideItem class="tab1" style="overflow: auto;">
<div class="mr2r ml2r mt1r"> <div class="mr2r ml2r mt1r">
<Search v-if="!isShowText" <Search v-if="!isShowRightText"
placeholder="搜索用户名字/抖音号" placeholder="搜索用户名字/抖音号"
:is-show-text="false" :is-show-right-text="false"
@click="isShowText = true"> @click="isShowRightText = true">
<img src="../../assets/img/icon/scan-gray.png" style="width: 1rem;transform: scale(1.5)" <img src="../../assets/img/icon/scan-gray.png" style="width: 1rem;transform: scale(1.5)"
@click.stop="$nav('/scan')"> @click.stop="$nav('/scan')">
</Search> </Search>
<Search v-else v-model="searchKey" :is-show-text="true" @notice="search" @clear="isSearch = false"></Search> <Search v-else v-model="searchKey" :is-show-right-text="true" @notice="search" @clear="isSearch = false"></Search>
</div> </div>
<div class="no-search" v-if="!isShowText"> <div class="no-search" v-if="!isShowRightText">
<div class="look-address-list" @click="findAddressListDialog = true"> <div class="look-address-list" @click="findAddressListDialog = true">
<img class="left" src="../../assets/img/icon/people/address-book.png" alt=""> <img class="left" src="../../assets/img/icon/people/address-book.png" alt="">
<div class="right"> <div class="right">
@ -149,7 +149,7 @@ export default {
moreOptionDialog: false, moreOptionDialog: false,
outWebImgAccountDialog: false, outWebImgAccountDialog: false,
indicatorFixed: false, indicatorFixed: false,
isShowText: false, isShowRightText: false,
isSearch: false, isSearch: false,
searchKey: '', searchKey: '',
@ -194,8 +194,8 @@ export default {
this.isSearch = true this.isSearch = true
}, },
back() { back() {
if (this.isShowText) { if (this.isShowRightText) {
this.isShowText = false this.isShowRightText = false
} else { } else {
this.$back() this.$back()
} }

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

@ -21,7 +21,7 @@
</div> </div>
<SlideRowList v-model:active-index="slideIndex" style="height: calc(100vh - 11.1rem)"> <SlideRowList v-model:active-index="slideIndex" style="height: calc(100vh - 11.1rem)">
<SlideItem class="tab1"> <SlideItem class="tab1">
<Search v-model="searchKey" placeholder="搜索用户备注或名字" :is-show-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">
<div class="search-result" v-if="searchFriends.length"> <div class="search-result" v-if="searchFriends.length">
<People v-for="item in searchFriends " :people="item"></People> <People v-for="item in searchFriends " :people="item"></People>
@ -97,8 +97,8 @@ export default {
this.isSearch = true this.isSearch = true
}, },
back() { back() {
if (this.isShowText) { if (this.isShowRightText) {
this.isShowText = false this.isShowRightText = false
} else { } else {
this.$back() this.$back()
} }