fix
This commit is contained in:
@@ -207,8 +207,11 @@ watch(
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
.learn-container {
|
/* 桌面端固定高度,让目录/内容/代码三栏各自内部滚动;移动端不限高,交给页面整体滚动 */
|
||||||
height: calc(100vh - 138px);
|
@media (min-width: 769px) {
|
||||||
|
.learn-container {
|
||||||
|
height: calc(100vh - 138px);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.learn-grid {
|
.learn-grid {
|
||||||
|
|||||||
@@ -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="
|
||||||
|
|||||||
@@ -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>© 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>
|
||||||
|
|||||||
Reference in New Issue
Block a user