fix
This commit is contained in:
@@ -207,9 +207,12 @@ watch(
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
/* 桌面端固定高度,让目录/内容/代码三栏各自内部滚动;移动端不限高,交给页面整体滚动 */
|
||||
@media (min-width: 769px) {
|
||||
.learn-container {
|
||||
height: calc(100vh - 138px);
|
||||
}
|
||||
}
|
||||
|
||||
.learn-grid {
|
||||
height: 100%;
|
||||
|
||||
@@ -72,6 +72,57 @@ const showGoSubmissionButton = computed(() => {
|
||||
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) => ({
|
||||
label: () =>
|
||||
h(NFlex, { align: "center" }, () => [
|
||||
@@ -161,14 +212,14 @@ onMounted(() => {
|
||||
<SubmitCode v-else />
|
||||
|
||||
<IconButton
|
||||
v-if="showGoSubmissionButton"
|
||||
v-if="isDesktop && showGoSubmissionButton"
|
||||
icon="streamline-ultimate-color:task-list-text-1"
|
||||
tip="提交信息"
|
||||
@click="goSubmissions"
|
||||
/>
|
||||
|
||||
<IconButton
|
||||
v-if="userStore.isTeacherOrAbove"
|
||||
v-if="isDesktop && userStore.isTeacherOrAbove"
|
||||
icon="streamline-ultimate-color:analytics-pie-2"
|
||||
tip="统计信息"
|
||||
@click="statisticPanel = true"
|
||||
@@ -183,18 +234,35 @@ onMounted(() => {
|
||||
/>
|
||||
|
||||
<IconButton
|
||||
v-if="isDesktop"
|
||||
icon="streamline-ultimate-color:copy-paste-1"
|
||||
tip="复制代码"
|
||||
@click="copy"
|
||||
/>
|
||||
|
||||
<IconButton
|
||||
v-if="isDesktop"
|
||||
icon="streamline-ultimate-color:synchronize-arrow"
|
||||
tip="重置代码"
|
||||
@click="reset"
|
||||
/>
|
||||
</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">
|
||||
<IconButton
|
||||
:icon="
|
||||
|
||||
@@ -3,12 +3,15 @@
|
||||
v-if="!hiddenICP"
|
||||
justify="center"
|
||||
align="center"
|
||||
:vertical="isMobile"
|
||||
:size="isMobile ? 4 : 'medium'"
|
||||
:wrap="false"
|
||||
class="beian"
|
||||
:class="{ 'beian--mobile': isMobile }"
|
||||
>
|
||||
<n-flex justify="center" align="center" :vertical="isMobile" size="small">
|
||||
<n-text>© 2022 - 2026 判题狗 保留所有权利</n-text>
|
||||
<n-button text @click="goCC">CC BY-NC 4.0</n-button>
|
||||
<n-flex justify="center" align="center" :size="isMobile ? 4 : 'small'">
|
||||
<n-text>{{ copyrightText }}</n-text>
|
||||
<!-- 移动端隐藏 CC 链接,腾出空间让备案号挤进一行 -->
|
||||
<n-button v-if="!isMobile" text @click="goCC">CC BY-NC 4.0</n-button>
|
||||
</n-flex>
|
||||
<n-button text @click="goICP">浙ICP备2023044109号-1</n-button>
|
||||
<n-button text @click="goPublicSecurity">
|
||||
@@ -25,6 +28,14 @@ const hiddenICP = computed(() =>
|
||||
["problem", "contest problem"].includes(route.name as string),
|
||||
)
|
||||
|
||||
// 移动端精简版权文案,配合小号字体挤进一行;结束年份取当前年份
|
||||
const currentYear = new Date().getFullYear()
|
||||
const copyrightText = computed(() =>
|
||||
isMobile.value
|
||||
? `© ${currentYear} 判题狗`
|
||||
: `© 2022 - ${currentYear} 判题狗 保留所有权利`,
|
||||
)
|
||||
|
||||
function goICP() {
|
||||
window.open("https://beian.miit.gov.cn", "_blank")
|
||||
}
|
||||
@@ -47,4 +58,17 @@ function goPublicSecurity() {
|
||||
.beian {
|
||||
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>
|
||||
|
||||
Reference in New Issue
Block a user