This commit is contained in:
zilong 2021-11-06 12:07:41 +08:00
parent f0e5ea4363
commit d70bf6738e
6 changed files with 63 additions and 27 deletions

View File

@ -130,6 +130,11 @@ const hideWins = (e) => {
showSearch.value = false;
}
};
const keyup = (e) => {
console.log(e);
}
</script>
<template>
@ -152,9 +157,9 @@ const hideWins = (e) => {
</div>
<div id="main">
<router-view v-slot="{ Component, route }">
<!-- <keep-alive exclude="FM,Friends"> -->
<keep-alive exclude="FM,Friends">
<component :is="Component" />
<!-- </keep-alive> -->
</keep-alive>
</router-view>
<!-- <router-view v-slot="{ Component, route }">
<keep-alive v-if="route.meta.keepAlive">
@ -211,6 +216,7 @@ body {
}
* {
box-sizing: border-box;
// scroll-behavior: smooth;
}
.top-menu {

View File

@ -4,7 +4,7 @@ import { useStore } from "vuex";
//设置
let config = {
elName: "mainContent", //#元素名称
log: false, //是否显示log
log: true, //是否显示log
};
const backSnaps = []; //返回快照数组
@ -25,9 +25,13 @@ export function cfg(cfg){
export function useBackSnaps() {
onActivated(() => {
if (config.log)
console.log("useBackSnaps: onActivated事件", backSnaps);
restore();
});
onMounted(() => {
if (config.log)
console.log("useBackSnaps: onMounted", backSnaps);
restore();
});
@ -60,10 +64,11 @@ export const saveBackSnaps = () => {
//保存
if (idx > -1) {
const backSnap = {
idx,
_idx: idx,
scrollTop: $content ? $content.scrollTop : 0,
};
// console.log("路由afterEach: ", backSnap);
if (config.log)
console.log("useBackSnaps: 保存之前",backSnap, backSnaps)
if (backSnaps.length < idx + 1) backSnaps.length = idx + 1;
backSnaps[idx] = backSnaps[idx] ? {...backSnaps[idx], ...backSnap} : backSnap
// backSnaps[idx] = backSnap;
@ -81,8 +86,10 @@ export const saveSnap = (snap)=>{
// url: window.location.href,
// };
// // console.log("路由afterEach: ", backSnap);
if (config.log)
console.log("useBackSnaps: 保存当前页面",snap, backSnaps);
if (backSnaps.length < idx + 1) backSnaps.length = idx + 1;
backSnaps[idx] = backSnaps[idx] ? {...backSnaps[idx], ...{other: snap}} : {other: snap}
backSnaps[idx] = backSnaps[idx] ? {...backSnaps[idx], ...snap} : {...snap}
// backSnaps[idx] = backSnap;
if (config.log)
console.log("useBackSnaps: 保存当前页面", backSnaps);

View File

@ -32,9 +32,8 @@ const snap = {
page: 1,
pageSize: 50,
},
...getSnap()?.other,
...getSnap(),
};
console.log(snap);
const Songlist = defineAsyncComponent(() =>
import("@/components/Songlist.vue")
@ -72,6 +71,7 @@ watch(
() => [props.keywords, type.value, page.value, pageSize.value],
([k, t]) => {
keywords.value = k;
// console.log('Searching...', keywords.value, type.value, page.value, pageSize.value);
search();
}
// { immediate: true }
@ -81,9 +81,14 @@ onMounted(() => {
search();
});
let firstTime = true;
// let firstTime = true;
// onActivated(()=>{
// console.log('actived---------');
// firstTime = true
// })
const search = () => {
// console.log('Searching...', keywords.value, type.value, page.value, pageSize.value);
switch (type.value) {
case 10:
things.value = "专辑";
@ -147,13 +152,10 @@ const search = () => {
if (page.value > maxPage) page.value = maxPage;
if (page.value < 1) page.value = 1;
if (firstTime) {
setTimeout(() => {
console.log(getScrollTop());
elWp.value.scrollTop = getScrollTop();
}, 100);
firstTime = false;
} else elWp.value.scrollTop = 0;
setTimeout(() => {
console.log(getScrollTop());
elWp.value.scrollTop = getScrollTop();
}, 50);
saveSnap({
type: type.value,
@ -194,6 +196,11 @@ const click = () => {
console.log(elWp.value.scrollTop);
window.history.pushState(null, null);
};
const pageChange = (p) => {
page.value = p;
saveSnap({ scrollTop: 0 });
};
</script>
<template>
@ -231,35 +238,50 @@ const click = () => {
<span
class="caption"
:style="selStyle('10')"
@click="type = 10;page=1;"
@click="
type = 10;
page = 1;
"
>
专辑
</span>
<span
class="caption"
:style="selStyle('1000')"
@click="type = 1000;page=1;"
@click="
type = 1000;
page = 1;
"
>
歌单
</span>
<span
class="caption"
:style="selStyle('1009')"
@click="type = 1009;page=1;"
@click="
type = 1009;
page = 1;
"
>
电台
</span>
<span
class="caption"
:style="selStyle('1004')"
@click="type = 1004;page=1;"
@click="
type = 1004;
page = 1;
"
>
MV
</span>
<span
class="caption"
:style="selStyle('1014')"
@click="type = 1014;page=1;"
@click="
type = 1014;
page = 1;
"
>
视频
</span>
@ -298,9 +320,10 @@ const click = () => {
<div class="panel" v-show="type == 1000"></div>
</div>
<div class="pager">
<NPagination
<NPagination v-show="count>0"
v-model:page="page"
:page-count="Math.ceil(count / pageSize)"
:on-update:page="pageChange"
/>
</div>
</div>

View File

@ -14,7 +14,7 @@ const keywords = ref("");
const elSearch = ref(null);
const search = () => {
if (keywords.value.length > 0){
if (keywords.value.trim().length > 0){
pubsub.publish("zp.toggleSearch");
// elSearch.value.blur()
store.commit('addSearchHistory', keywords.value)

View File

@ -50,7 +50,7 @@ const keywords = ref("");
const token = pubsub.subscribe("zp", (msg, data) => {
switch (msg) {
case "zp.searchInput":
keywords.value = data;
keywords.value = data.trim();
suggest(keywords.value);
break;
}

View File

@ -211,14 +211,14 @@ export default {};
align-items: center;
.song-name {
// flex: 1;
.text-el-line-normal();
.text-el-line();
}
.song-author {
// flex: 1;
margin-left: 4px;
color: #aaa;
font-size: 13px;
.text-el-line-normal();
.text-el-line();
}
}
.song-time {