更新任务
This commit is contained in:
jimmy committed
1 parent
120a57ad57
commit
6118a80ac4
279 files changed
+9682
-2362
No files matched your search
@@ -0,0 +1,57 @@
|
||||
<template>
|
||||
<div class="comments" v-if="!frontmatter.isNoComment">
|
||||
<!-- params generate in https://giscus.app/zh-CN -->
|
||||
|
||||
<Giscus
|
||||
v-if="showComment"
|
||||
repo="duyl328/duyl328.github.io"
|
||||
repo-id="R_kgDONmELAA"
|
||||
category="Announcements"
|
||||
category-id="DIC_kwDONmELAM4ClzgV"
|
||||
mapping="specific"
|
||||
:term="term"
|
||||
strict="1"
|
||||
reactions-enabled="1"
|
||||
emit-metadata="0"
|
||||
input-position="top"
|
||||
:theme="theme"
|
||||
:lang="lang"
|
||||
loading="lazy"
|
||||
crossorigin="anonymous"
|
||||
/>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { ref, watch, nextTick, computed } from 'vue'
|
||||
import { useData, useRoute } from 'vitepress'
|
||||
import Giscus from '@giscus/vue'
|
||||
|
||||
const route = useRoute()
|
||||
const { isDark, frontmatter } = useData()
|
||||
|
||||
// 保证中英文路径显示同一个评论
|
||||
const term = computed(() => route.path)
|
||||
const theme = computed(() => (isDark.value ? 'noborder_dark' : 'noborder_light'))
|
||||
const lang = computed(() => 'zh-Hans')
|
||||
|
||||
// language 变化不会触发重新加载，这里 v-if 强制刷新
|
||||
const showComment = ref(true)
|
||||
watch(
|
||||
() => route.path,
|
||||
() => {
|
||||
showComment.value = false
|
||||
nextTick(() => {
|
||||
showComment.value = true
|
||||
})
|
||||
},
|
||||
{
|
||||
immediate: true,
|
||||
},
|
||||
)
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.comments {
|
||||
margin-top: 80px;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,55 @@
|
||||
<template>
|
||||
<t-button
|
||||
v-if="isPosts && !frontmatter.isNoBackBtn"
|
||||
theme="default"
|
||||
variant="dashed"
|
||||
style="margin-bottom: 10px"
|
||||
@click="goBack"
|
||||
>
|
||||
<template #icon>
|
||||
<RollbackIcon/>
|
||||
</template>
|
||||
{{ '返回上一页' }}
|
||||
</t-button>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref, computed, onMounted, onUnmounted } from 'vue'
|
||||
import { useRoute, useData } from 'vitepress'
|
||||
import { RollbackIcon } from 'tdesign-icons-vue-next'
|
||||
|
||||
const route = useRoute()
|
||||
const isPosts = computed(() => route.path.startsWith('/posts'))
|
||||
const { frontmatter } = useData()
|
||||
|
||||
function goBack () {
|
||||
if (window.history.length <= 1) {
|
||||
location.href = '/'
|
||||
} else {
|
||||
window.history.go(hashChangeCount.value)
|
||||
hashChangeCount.value = -1
|
||||
}
|
||||
}
|
||||
|
||||
const hashChangeCount = ref(-1)
|
||||
onMounted(() => {
|
||||
window.onhashchange = () => {
|
||||
hashChangeCount.value--
|
||||
}
|
||||
})
|
||||
|
||||
onUnmounted(() => {
|
||||
window.onhashchange = null
|
||||
})
|
||||
</script>
|
||||
<style scoped>
|
||||
.img-container {
|
||||
height: 105px;
|
||||
width: 100px;
|
||||
}
|
||||
|
||||
img {
|
||||
height: 100px;
|
||||
border-radius: 5px;
|
||||
margin-top: 5px;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,92 @@
|
||||
<template>
|
||||
<div class="image-viewer">
|
||||
<t-config-provider :global-config="globalConfig">
|
||||
<t-image-viewer
|
||||
v-model:visible="show"
|
||||
:images="previewImageInfo.list"
|
||||
:default-index="previewImageInfo.idx"
|
||||
:key="previewImageInfo.idx"
|
||||
@close="show = false"
|
||||
>
|
||||
</t-image-viewer>
|
||||
<TDesignDark/>
|
||||
</t-config-provider>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { onMounted, onUnmounted, reactive, ref, watch } from 'vue'
|
||||
import { useRoute } from 'vitepress'
|
||||
// import enConfig from 'tdesign-vue-next/es/locale/en_US'
|
||||
import zhConfig from 'tdesign-vue-next/es/locale/zh_CN'
|
||||
|
||||
import TDesignDark from './TDesignDark.vue'
|
||||
|
||||
// 处理 TDesign 的国际化
|
||||
const route = useRoute()
|
||||
const globalConfig = ref<typeof zhConfig >(zhConfig)
|
||||
watch(
|
||||
() => route.path,
|
||||
() => {
|
||||
globalConfig.value = zhConfig
|
||||
},
|
||||
{
|
||||
immediate: true,
|
||||
},
|
||||
)
|
||||
|
||||
// 处理图片预览
|
||||
const show = ref(false)
|
||||
const previewImageInfo = reactive<{ url: string; list: string[]; idx: number }>(
|
||||
{
|
||||
url: '',
|
||||
list: [],
|
||||
idx: 0,
|
||||
},
|
||||
)
|
||||
|
||||
function previewImage (e: Event) {
|
||||
const target = e.target as HTMLElement
|
||||
const currentTarget = e.currentTarget as HTMLElement
|
||||
if (target.tagName.toLowerCase() === 'img') {
|
||||
const imgs = currentTarget.querySelectorAll<HTMLImageElement>(
|
||||
'.content-container .main img',
|
||||
)
|
||||
const idx = Array.from(imgs).findIndex((el) => el === target)
|
||||
const urls = Array.from(imgs).map((el) => el.src)
|
||||
|
||||
const url = target.getAttribute('src')
|
||||
previewImageInfo.url = url!
|
||||
previewImageInfo.list = urls
|
||||
previewImageInfo.idx = idx
|
||||
|
||||
// 兼容点击 main 之外的图片
|
||||
if (idx === -1 && url) {
|
||||
previewImageInfo.list.push(url)
|
||||
previewImageInfo.idx = previewImageInfo.list.length - 1
|
||||
}
|
||||
show.value = true
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
if (typeof document !== 'undefined') {
|
||||
// 使用document的代码
|
||||
const docDomContainer = document.querySelector('#VPContent')
|
||||
docDomContainer?.addEventListener('click', previewImage)
|
||||
}
|
||||
})
|
||||
|
||||
onUnmounted(() => {
|
||||
if (typeof document !== 'undefined') {
|
||||
// 使用document的代码
|
||||
const docDomContainer = document.querySelector('#VPContent')
|
||||
docDomContainer?.removeEventListener('click', previewImage)
|
||||
}
|
||||
})
|
||||
</script>
|
||||
<style>
|
||||
/* 不提供下载功能，隐藏下载按钮，tdesign 下载有问题 */
|
||||
.t-image-viewer__modal-icon:nth-child(7) {
|
||||
display: none !important;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,17 @@
|
||||
<template>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { useRouter } from 'vitepress'
|
||||
|
||||
import { createSideBarZH } from '../utils/createSideBar'
|
||||
|
||||
const router = useRouter()
|
||||
|
||||
const sideBar = createSideBarZH()
|
||||
|
||||
const prefix = '/notes/'
|
||||
const firstItemLink = sideBar[prefix][0].items[0].link
|
||||
|
||||
router.go(firstItemLink)
|
||||
</script>
|
||||
<style scoped></style>
|
||||
@@ -0,0 +1,25 @@
|
||||
<template></template>
|
||||
<script setup lang="ts">
|
||||
import { useData } from 'vitepress'
|
||||
import { watch } from 'vue'
|
||||
|
||||
const { isDark } = useData()
|
||||
|
||||
// tdesign 暗色切换 https://tdesign.tencent.com/vue-next/dark-mode
|
||||
watch(
|
||||
isDark,
|
||||
() => {
|
||||
if (typeof document !== 'undefined') {
|
||||
// 使用document的代码
|
||||
if (isDark.value) {
|
||||
document.documentElement.setAttribute('theme-mode', 'dark')
|
||||
} else {
|
||||
document.documentElement.removeAttribute('theme-mode')
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
immediate: true,
|
||||
},
|
||||
)
|
||||
</script>
|
||||
Reference in new issue
Block a user