This commit is contained in:
2026-07-24 06:46:59 -06:00
parent be1b9a97a0
commit 4e5b2fdb3e
3 changed files with 103 additions and 8 deletions

View File

@@ -207,9 +207,12 @@ watch(
</script> </script>
<style scoped> <style scoped>
/* 桌面端固定高度,让目录/内容/代码三栏各自内部滚动;移动端不限高,交给页面整体滚动 */
@media (min-width: 769px) {
.learn-container { .learn-container {
height: calc(100vh - 138px); height: calc(100vh - 138px);
} }
}
.learn-grid { .learn-grid {
height: 100%; height: 100%;

View File

@@ -72,6 +72,57 @@ const showGoSubmissionButton = computed(() => {
else return false else return false
}) })
// 移动端把「提交信息 / 统计信息 / 复制代码 / 重置代码」收进下拉菜单,节省横向空间
const renderIcon = (icon: string) => () => h(Icon, { icon, width: 18 })
const mobileMenuOptions = computed<DropdownOption[]>(() => {
const options: DropdownOption[] = []
if (showGoSubmissionButton.value) {
options.push({
label: "提交信息",
key: "submissions",
icon: renderIcon("streamline-ultimate-color:task-list-text-1"),
})
}
if (userStore.isTeacherOrAbove) {
options.push({
label: "统计信息",
key: "statistics",
icon: renderIcon("streamline-ultimate-color:analytics-pie-2"),
})
}
if (codeStore.code.language !== "Flowchart") {
options.push({
label: "复制代码",
key: "copy",
icon: renderIcon("streamline-ultimate-color:copy-paste-1"),
})
options.push({
label: "重置代码",
key: "reset",
icon: renderIcon("streamline-ultimate-color:synchronize-arrow"),
})
}
return options
})
const handleMobileSelect = (key: string) => {
switch (key) {
case "submissions":
goSubmissions()
break
case "statistics":
statisticPanel.value = true
break
case "copy":
copy()
break
case "reset":
reset()
break
}
}
const languageOptions: DropdownOption[] = languages.value.map((it) => ({ const languageOptions: DropdownOption[] = languages.value.map((it) => ({
label: () => label: () =>
h(NFlex, { align: "center" }, () => [ h(NFlex, { align: "center" }, () => [
@@ -161,14 +212,14 @@ onMounted(() => {
<SubmitCode v-else /> <SubmitCode v-else />
<IconButton <IconButton
v-if="showGoSubmissionButton" v-if="isDesktop && showGoSubmissionButton"
icon="streamline-ultimate-color:task-list-text-1" icon="streamline-ultimate-color:task-list-text-1"
tip="提交信息" tip="提交信息"
@click="goSubmissions" @click="goSubmissions"
/> />
<IconButton <IconButton
v-if="userStore.isTeacherOrAbove" v-if="isDesktop && userStore.isTeacherOrAbove"
icon="streamline-ultimate-color:analytics-pie-2" icon="streamline-ultimate-color:analytics-pie-2"
tip="统计信息" tip="统计信息"
@click="statisticPanel = true" @click="statisticPanel = true"
@@ -183,18 +234,35 @@ onMounted(() => {
/> />
<IconButton <IconButton
v-if="isDesktop"
icon="streamline-ultimate-color:copy-paste-1" icon="streamline-ultimate-color:copy-paste-1"
tip="复制代码" tip="复制代码"
@click="copy" @click="copy"
/> />
<IconButton <IconButton
v-if="isDesktop"
icon="streamline-ultimate-color:synchronize-arrow" icon="streamline-ultimate-color:synchronize-arrow"
tip="重置代码" tip="重置代码"
@click="reset" @click="reset"
/> />
</template> </template>
<!-- 移动端提交信息 / 统计信息 / 复制代码 / 重置代码 收进下拉菜单 -->
<n-dropdown
v-if="!isDesktop && mobileMenuOptions.length"
trigger="click"
:options="mobileMenuOptions"
@select="handleMobileSelect"
>
<n-button round size="small">
更多
<template #icon>
<Icon icon="streamline-ultimate-color:navigation-menu-vertical" />
</template>
</n-button>
</n-dropdown>
<template v-if="showSyncFeature"> <template v-if="showSyncFeature">
<IconButton <IconButton
:icon=" :icon="

View File

@@ -3,12 +3,15 @@
v-if="!hiddenICP" v-if="!hiddenICP"
justify="center" justify="center"
align="center" align="center"
:vertical="isMobile" :size="isMobile ? 4 : 'medium'"
:wrap="false"
class="beian" class="beian"
:class="{ 'beian--mobile': isMobile }"
> >
<n-flex justify="center" align="center" :vertical="isMobile" size="small"> <n-flex justify="center" align="center" :size="isMobile ? 4 : 'small'">
<n-text>&copy; 2022 - 2026 判题狗 保留所有权利</n-text> <n-text>{{ copyrightText }}</n-text>
<n-button text @click="goCC">CC BY-NC 4.0</n-button> <!-- 移动端隐藏 CC 链接腾出空间让备案号挤进一行 -->
<n-button v-if="!isMobile" text @click="goCC">CC BY-NC 4.0</n-button>
</n-flex> </n-flex>
<n-button text @click="goICP">浙ICP备2023044109号-1</n-button> <n-button text @click="goICP">浙ICP备2023044109号-1</n-button>
<n-button text @click="goPublicSecurity"> <n-button text @click="goPublicSecurity">
@@ -25,6 +28,14 @@ const hiddenICP = computed(() =>
["problem", "contest problem"].includes(route.name as string), ["problem", "contest problem"].includes(route.name as string),
) )
// 移动端精简版权文案,配合小号字体挤进一行;结束年份取当前年份
const currentYear = new Date().getFullYear()
const copyrightText = computed(() =>
isMobile.value
? `© ${currentYear} 判题狗`
: `© 2022 - ${currentYear} 判题狗 保留所有权利`,
)
function goICP() { function goICP() {
window.open("https://beian.miit.gov.cn", "_blank") window.open("https://beian.miit.gov.cn", "_blank")
} }
@@ -47,4 +58,17 @@ function goPublicSecurity() {
.beian { .beian {
margin: 12px 0; margin: 12px 0;
} }
/* 移动端:单行 + 小号字体,超宽时容器内部横向滚动,不撑破页面 */
.beian--mobile {
font-size: 12px;
max-width: 100%;
overflow-x: auto;
padding: 0 8px;
}
.beian--mobile :deep(.n-button__content),
.beian--mobile :deep(.n-text) {
font-size: 12px;
}
</style> </style>