Merge pull request #212 from imsyy/dev

feat: 同步
This commit is contained in:
底层用户 2023-11-09 10:01:59 +08:00 committed by GitHub
commit 392dbf84e3
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
13 changed files with 70 additions and 26 deletions

4
.env
View File

@ -3,7 +3,7 @@ VITE_SITE_NAME = "無名の主页" # 名称
VITE_SITE_ANTHOR = "無名" # 作者
VITE_SITE_KEYWORDS = "無名,个人主页" # 关键词
VITE_SITE_DES = "一个默默无闻的主页" # 站点简介
VITE_SITE_URL = "imsyy.top" # 站点地址
VITE_SITE_URL = "jmsyy.top" # 站点地址
VITE_SITE_LOGO = "/images/icon/favicon.ico" # 站点主图标
VITE_SITE_MAIN_LOGO = "/images/icon/logo.png" # 主页图标
VITE_SITE_APPLE_LOGO = "/images/logo/apple-touch-icon.png" # Apple 端图标
@ -47,5 +47,5 @@ VITE_SONG_API = "https://api-meting.imsyy.top/api"
VITE_SONG_SERVER = "netease"
# 播放类型 ( song-歌曲, playlist-播放列表, album-专辑, search-搜索, artist-艺术家 )
VITE_SONG_TYPE = "playlist"
# 播放 ID
# 播放 ID ( 若无需播放器,请设为空即可 )
VITE_SONG_ID = "7452421335"

View File

@ -207,7 +207,7 @@ if (type == 0) {
* [高德开放平台](https://lbs.amap.com/)
* [Hitokoto 一言](https://hitokoto.cn/)
* [MetingAPI By 武恩赐](https://api.wuenci.com/meting/api/)
*
## Star History
[![Star History Chart](https://api.star-history.com/svg?repos=imsyy/home&type=Date)](https://star-history.com/#imsyy/home&Date)

View File

@ -4,7 +4,7 @@
"github": "https://github.com/imsyy/home",
"home": "https://imsyy.top",
"private": true,
"version": "4.1.2",
"version": "4.1.3",
"type": "module",
"scripts": {
"dev": "vite --host",

Binary file not shown.

3
public/font/README.md Normal file
View File

@ -0,0 +1,3 @@
## Logo 字体替换
可将该文件夹下的 `Pacifico-Regular-all.ttf` 替换原来的 `Pacifico-Regular.ttf`

View File

@ -17,7 +17,12 @@
</section>
</div>
<!-- 移动端菜单按钮 -->
<Icon class="menu" size="24" @click="store.mobileOpenState = !store.mobileOpenState">
<Icon
class="menu"
size="24"
v-show="!store.backgroundShow"
@click="store.mobileOpenState = !store.mobileOpenState"
>
<component :is="store.mobileOpenState ? CloseSmall : HamburgerButton" />
</Icon>
<!-- 页脚 -->
@ -178,7 +183,7 @@ onBeforeUnmount(() => {
.i-icon {
transform: translateY(2px);
}
@media (min-width: 720px) {
@media (min-width: 721px) {
display: none;
}
}

View File

@ -1,5 +1,5 @@
<template>
<div class="cover">
<div :class="store.backgroundShow ? 'cover show' : 'cover'">
<img
v-show="store.imgLoadStatus"
class="bg"
@ -99,6 +99,10 @@ onBeforeUnmount(() => {
transition: 0.25s;
z-index: -1;
&.show {
z-index: 1;
}
.bg {
position: absolute;
left: 0;

View File

@ -18,10 +18,12 @@
</div>
</Transition>
<!-- 一言内容 -->
<div class="content" @click="updateHitokoto">
<span class="text">{{ hitokotoData.text }}</span>
<span class="from">-&nbsp;{{ hitokotoData.from }}&nbsp;</span>
</div>
<Transition name="el-fade-in-linear" mode="out-in">
<div :key="hitokotoData.text" class="content" @click="updateHitokoto">
<span class="text">{{ hitokotoData.text }}</span>
<span class="from">-&nbsp;{{ hitokotoData.from }}&nbsp;</span>
</div>
</Transition>
</div>
</template>
@ -57,13 +59,13 @@ const getHitokotoData = () => {
fill: "#efefef",
}),
});
hitokotoData.text = "这里应该显示一句话";
hitokotoData.from = "無名";
});
};
//
const updateHitokoto = () => {
hitokotoData.text = "新的一言正在赶来的路上";
hitokotoData.from = "来源加载中";
//
debounce(() => {
getHitokotoData();

View File

@ -4,7 +4,7 @@
<!-- Logo -->
<div class="logo">
<img class="logo-img" :src="siteLogo" alt="logo" />
<div class="name text-hidden">
<div :class="{ name: true, 'text-hidden': true, long: siteUrl[0].length >= 6 }">
<span class="bg">{{ siteUrl[0] }}</span>
<span class="sm">.{{ siteUrl[1] }}</span>
</div>
@ -97,9 +97,8 @@ watch(
width: 120px;
}
.name {
width: 100%;
height: 142px;
margin-left: 12px;
width: calc(460px - 120px);
padding-left: 22px;
transform: translateY(-8px);
font-family: "Pacifico-Regular";

View File

@ -42,7 +42,7 @@
</div>
</div>
<!-- 音乐列表弹窗 -->
<Transition name="fade">
<Transition name="fade" mode="out-in">
<div class="music-list" v-show="musicListShow" @click="musicListShow = false">
<Transition name="zoom">
<div class="list" v-show="musicListShow" @click.stop>
@ -281,12 +281,6 @@ watch(
}
//
.fade-enter-active {
animation: fade 0.3s ease-in-out;
}
.fade-leave-active {
animation: fade 0.3s ease-in-out reverse;
}
.zoom-enter-active {
animation: zoom 0.4s ease-in-out;
}

View File

@ -16,6 +16,7 @@
@pause="onPause"
@timeupdate="onTimeUp"
@onSelectSong="onSelectSong"
@error="loadMusicError"
/>
</template>
@ -37,6 +38,8 @@ const playList = ref([]);
const playIndex = ref(0);
const playListCount = ref(0);
const skipTimeout = ref(null);
//
const props = defineProps({
//
@ -202,8 +205,39 @@ const changeSong = (type) => {
});
};
//
const loadMusicError = () => {
let notice = "";
if (playList.value.length > 1) {
notice = "播放歌曲出现错误,播放器将在 2s 后进行下一首";
//
skipTimeout.value = setTimeout(() => {
changeSong(1);
if (!player.value.audio.paused) {
onPlay();
}
}, 2000);
} else {
notice = "播放歌曲出现错误";
}
ElMessage({
message: notice,
grouping: true,
icon: h(PlayWrong, {
theme: "filled",
fill: "#EFEFEF",
duration: 2000,
}),
});
console.error("播放歌曲: " + player.value.currentMusic.title + " 出现错误");
};
//
defineExpose({ playToggle, changeVolume, changeSong });
onBeforeUnmount(() => {
clearTimeout(skipTimeout.value);
});
</script>
<style lang="scss" scoped>

View File

@ -5,7 +5,7 @@
<el-col :span="12">
<div class="left">
<Hitokoto />
<Music />
<Music v-if="playerHasId" />
</div>
</el-col>
<el-col :span="12">
@ -41,6 +41,9 @@ const store = mainStore();
const currentTime = ref({});
const timeInterval = ref(null);
// id
const playerHasId = import.meta.env.VITE_SONG_ID;
//
const updateTimeData = () => {
currentTime.value = getCurrentTime();

View File

@ -133,7 +133,7 @@ const jumpTo = (url) => {
.logo {
transform: translateY(-8%);
font-family: "Pacifico-Regular";
// line-height: 5rem;
padding-left: 22px;
width: 100%;
height: 260px;