add cache.
This commit is contained in:
@@ -1,6 +1,8 @@
|
|||||||
|
import { STORAGE_KEY } from "~/utils/constants"
|
||||||
|
import storage from "~/utils/storage"
|
||||||
import { Code } from "~/utils/types"
|
import { Code } from "~/utils/types"
|
||||||
|
|
||||||
export const code = reactive<Code>({
|
export const code = reactive<Code>({
|
||||||
value: "",
|
value: "",
|
||||||
language: "C",
|
language: storage.get(STORAGE_KEY.LANGUAGE) || "C",
|
||||||
})
|
})
|
||||||
|
|||||||
@@ -3,23 +3,47 @@ import { SOURCES } from "utils/constants"
|
|||||||
import { code } from "oj/composables/code"
|
import { code } from "oj/composables/code"
|
||||||
import { isDesktop } from "~/shared/composables/breakpoints"
|
import { isDesktop } from "~/shared/composables/breakpoints"
|
||||||
import { problem } from "oj/composables/problem"
|
import { problem } from "oj/composables/problem"
|
||||||
|
import storage from "~/utils/storage"
|
||||||
|
import { LANGUAGE } from "~/utils/types"
|
||||||
|
|
||||||
const Form = defineAsyncComponent(() => import("./Form.vue"))
|
const Form = defineAsyncComponent(() => import("./Form.vue"))
|
||||||
const CodeEditor = defineAsyncComponent(() => import("~/shared/CodeEditor.vue"))
|
const CodeEditor = defineAsyncComponent(() => import("~/shared/CodeEditor.vue"))
|
||||||
|
|
||||||
code.language = problem.value!.languages[0] || "C"
|
const route = useRoute()
|
||||||
code.value = problem.value!.template[code.language] || SOURCES[code.language]
|
const contestID = !!route.params.contestID ? route.params.contestID : null
|
||||||
|
|
||||||
|
const storageKey = computed(
|
||||||
|
() => `problem_${problem.value!._id}_contest_${contestID}`
|
||||||
|
)
|
||||||
|
|
||||||
|
onMounted(() => {
|
||||||
|
if (storage.get(storageKey.value)) {
|
||||||
|
code.value = storage.get(storageKey.value)
|
||||||
|
} else {
|
||||||
|
code.value =
|
||||||
|
problem.value!.template[code.language] || SOURCES[code.language]
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
const editorHeight = computed(() =>
|
const editorHeight = computed(() =>
|
||||||
isDesktop.value ? "calc(100vh - 133px)" : "calc(100vh - 172px)"
|
isDesktop.value ? "calc(100vh - 133px)" : "calc(100vh - 172px)"
|
||||||
)
|
)
|
||||||
|
|
||||||
|
function reset() {
|
||||||
|
storage.remove(storageKey.value)
|
||||||
|
}
|
||||||
|
|
||||||
|
function changeCode(v: string) {
|
||||||
|
storage.set(storageKey.value, v)
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<n-space vertical>
|
<n-space vertical>
|
||||||
<Form />
|
<Form @reset="reset" />
|
||||||
<CodeEditor
|
<CodeEditor
|
||||||
v-model="code.value"
|
v-model="code.value"
|
||||||
|
@update:model-value="changeCode"
|
||||||
:language="code.language"
|
:language="code.language"
|
||||||
:height="editorHeight"
|
:height="editorHeight"
|
||||||
/>
|
/>
|
||||||
|
|||||||
@@ -5,15 +5,21 @@ import { problem } from "oj/composables/problem"
|
|||||||
import { isDesktop, isMobile } from "~/shared/composables/breakpoints"
|
import { isDesktop, isMobile } from "~/shared/composables/breakpoints"
|
||||||
import { useUserStore } from "~/shared/store/user"
|
import { useUserStore } from "~/shared/store/user"
|
||||||
import Submit from "./Submit.vue"
|
import Submit from "./Submit.vue"
|
||||||
|
import storage from "~/utils/storage"
|
||||||
|
import { STORAGE_KEY } from "utils/constants"
|
||||||
|
import { LANGUAGE } from "~/utils/types"
|
||||||
|
|
||||||
const route = useRoute()
|
const route = useRoute()
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
const userStore = useUserStore()
|
const userStore = useUserStore()
|
||||||
|
|
||||||
|
const emit = defineEmits(["reset"])
|
||||||
|
|
||||||
watch(() => code.language, reset)
|
watch(() => code.language, reset)
|
||||||
|
|
||||||
function reset() {
|
function reset() {
|
||||||
code.value = problem.value!.template[code.language] || SOURCES[code.language]
|
code.value = problem.value!.template[code.language] || SOURCES[code.language]
|
||||||
|
emit("reset")
|
||||||
}
|
}
|
||||||
|
|
||||||
function goSubmissions() {
|
function goSubmissions() {
|
||||||
@@ -62,14 +68,19 @@ function select(key: string) {
|
|||||||
break
|
break
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function changeLanguage(v: LANGUAGE) {
|
||||||
|
storage.set(STORAGE_KEY.LANGUAGE, v)
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<n-space>
|
<n-space>
|
||||||
<n-select
|
<n-select
|
||||||
class="language"
|
class="language"
|
||||||
:size="isDesktop ? 'medium' : 'small'"
|
|
||||||
v-model:value="code.language"
|
v-model:value="code.language"
|
||||||
|
@update:value="changeLanguage"
|
||||||
|
:size="isDesktop ? 'medium' : 'small'"
|
||||||
:options="options"
|
:options="options"
|
||||||
/>
|
/>
|
||||||
<Submit />
|
<Submit />
|
||||||
|
|||||||
@@ -34,6 +34,10 @@ async function init() {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
onMounted(init)
|
onMounted(init)
|
||||||
|
onBeforeUnmount(() => {
|
||||||
|
problem.value = null
|
||||||
|
errMsg.value = "无数据"
|
||||||
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
|
|||||||
@@ -120,7 +120,7 @@ export const PROBLEM_PERMISSION = {
|
|||||||
|
|
||||||
export const STORAGE_KEY = {
|
export const STORAGE_KEY = {
|
||||||
AUTHED: "authed",
|
AUTHED: "authed",
|
||||||
PROBLEM_CODE: "problemCode",
|
LANGUAGE: "problemLanguage",
|
||||||
}
|
}
|
||||||
|
|
||||||
export const DIFFICULTY = {
|
export const DIFFICULTY = {
|
||||||
|
|||||||
Reference in New Issue
Block a user