Deploy / deploy (push) Canceled after 0s
首页「全部」、提交详情的用户名和题名、题目页「点开看全部」「有 N 道差一点」、 班级对抗的班级名、知识点、后台标题等 30 多处原来和正文同色,鼠标移上去才变色, 手机上根本没有「移上去」。现在一律主题绿,移上去加下划线;没设颜色的文字按钮补上 type="primary"。排名名字列、整行可点的列表、后台 quaternary 次要按钮不动。 Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
102 lines
2.6 KiB
Vue
102 lines
2.6 KiB
Vue
<script lang="ts">
|
|
import type { ProblemRow } from "utils/types"
|
|
|
|
/**
|
|
* 同一道题两处(题面末尾、结果页签)都挂着时只拉一次。放在模块级:写在 setup 里就成了
|
|
* 每个实例各一份
|
|
*/
|
|
const cache = new Map<string, Promise<ProblemRow[]>>()
|
|
</script>
|
|
|
|
<script setup lang="ts">
|
|
import { storeToRefs } from "pinia"
|
|
import { useThemeVars } from "naive-ui"
|
|
import { getSimilarProblems } from "oj/api"
|
|
import { useProblemStore } from "oj/store/problem"
|
|
|
|
/**
|
|
* 相似题推荐。题面末尾(做对了、或者错了 3 次以上)和结果页签(不在课堂里的题做对之后)
|
|
* 两处用:原来只在题面最底下,学生交完不会再滚回去看。什么时候出现由调用方的 v-if 决定。
|
|
*/
|
|
const props = defineProps<{ title: string }>()
|
|
|
|
const theme = useThemeVars()
|
|
|
|
const { problem } = storeToRefs(useProblemStore())
|
|
const list = ref<ProblemRow[]>([])
|
|
|
|
watch(
|
|
() => problem.value?._id,
|
|
async (id) => {
|
|
list.value = []
|
|
if (!id) return
|
|
if (!cache.has(id))
|
|
cache.set(
|
|
id,
|
|
getSimilarProblems(id).catch(() => []),
|
|
)
|
|
const rows = await cache.get(id)!
|
|
if (problem.value?._id === id) list.value = rows
|
|
},
|
|
{ immediate: true },
|
|
)
|
|
|
|
// getSimilarProblems 已经过 toProblemRow,难度是中文,不是 Low/Mid/High
|
|
function difficultyType(difficulty: string) {
|
|
if (difficulty === "简单") return "success"
|
|
if (difficulty === "困难") return "error"
|
|
return "warning"
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<section v-if="list.length" class="similar">
|
|
<h3 class="title">{{ props.title }}</h3>
|
|
<n-list bordered>
|
|
<n-list-item v-for="sp in list" :key="sp._id">
|
|
<n-flex align="center" justify="space-between" :wrap="false">
|
|
<router-link :to="{ name: 'problem', params: { problemID: sp._id } }" class="link">
|
|
<n-tag size="small" :bordered="false">{{ sp._id }}</n-tag>
|
|
<span class="name">{{ sp.title }}</span>
|
|
</router-link>
|
|
<n-tag v-if="sp.difficulty" size="small" :type="difficultyType(sp.difficulty)">
|
|
{{ sp.difficulty }}
|
|
</n-tag>
|
|
</n-flex>
|
|
</n-list-item>
|
|
</n-list>
|
|
</section>
|
|
</template>
|
|
|
|
<style scoped>
|
|
.similar {
|
|
margin-top: 20px;
|
|
}
|
|
|
|
.title {
|
|
font-size: 16px;
|
|
font-weight: 600;
|
|
margin: 0 0 8px;
|
|
}
|
|
|
|
.link {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 8px;
|
|
min-width: 0;
|
|
color: inherit;
|
|
text-decoration: none;
|
|
}
|
|
|
|
.link:hover .name {
|
|
text-decoration: underline;
|
|
}
|
|
|
|
.name {
|
|
color: v-bind("theme.primaryColor");
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
</style>
|