update

src/composables/code.ts

@@ -1,31 +1,61 @@
 import { ref } from "vue"
 import copyTextToClipboard from "copy-text-to-clipboard"
-import { Code, LANGUAGE } from "../types"
+import { Code, LANGUAGE, Cache } from "../types"
 import { sources } from "../templates"
 import { submit } from "../api"
+import { useStorage } from "@vueuse/core"
+
+const defaultLanguage = "python"
+
+const cache: Cache = {
+  language: useStorage<LANGUAGE>("code_language", defaultLanguage),
+  input: useStorage("code_input", ""),
+  code: {
+    python: useStorage("code_python", sources["python"]),
+    c: useStorage("code_c", sources["c"]),
+    java: useStorage("code_java", sources["java"]),
+    cpp: useStorage("code_cpp", sources["cpp"]),
+  },
+}
 
 export const code = ref<Code>({
-  value: sources["python"],
+  value: cache.code[defaultLanguage].value,
-  language: "python",
+  language: cache.language.value,
 })
-export const input = ref("")
+export const input = ref(cache.input.value)
 export const output = ref("")
 export const loading = ref(false)
 
+export function init() {
+  code.value.language = cache.language.value
+  code.value.value = cache.code[code.value.language].value
+  input.value = cache.input.value
+}
+
 export function copy() {
   copyTextToClipboard(code.value.value)
 }
 
 export function reset() {
-  code.value.value = sources["python"]
+  code.value.value = sources[code.value.language]
+  cache.code[code.value.language].value = sources[code.value.language]
   output.value = ""
 }
 
 export function changeLanguage(language: LANGUAGE) {
-  code.value.value = sources[language]
+  cache.language.value = language
+  code.value.value = cache.code[language].value
   output.value = ""
 }
 
+export function changeCode(value: string) {
+  cache.code[code.value.language].value = value
+}
+
+export function changeInput(value: string) {
+  cache.input.value = value
+}
+
 export async function run() {
   loading.value = true
   const cleanCode = code.value.value.trim()

src/desktop/Content.vue

@@ -1,3 +1,18 @@
+<script lang="ts" setup>
+import {
+  code,
+  init,
+  input,
+  output,
+  changeCode,
+  changeInput,
+} from "../composables/code"
+import CodeEditor from "../components/CodeEditor.vue"
+import { onMounted } from "vue"
+
+onMounted(init)
+</script>
+
 <template>
   <n-layout-content class="container">
     <n-split direction="horizontal" :min="1 / 3" :max="4 / 5">
@@ -5,6 +20,7 @@
         <CodeEditor
           label="代码区"
           v-model="code.value"
+          @update:model-value="changeCode"
           :language="code.language"
         />
       </template>
@@ -16,7 +32,11 @@
           :max="3 / 5"
         >
           <template #1>
-            <CodeEditor label="输入框" v-model="input" />
+            <CodeEditor
+              label="输入框"
+              v-model="input"
+              @update:model-value="changeInput"
+            />
           </template>
           <template #2>
             <CodeEditor label="输出框" v-model="output" readonly />
@@ -26,10 +46,7 @@
     </n-split>
   </n-layout-content>
 </template>
-<script lang="ts" setup>
+
-import { code, input, output } from "../composables/code"
-import CodeEditor from "../components/CodeEditor.vue"
-</script>
 <style scoped>
 .container {
   height: calc(100vh - 60px);

src/types.ts

@@ -1,6 +1,14 @@
+import { RemovableRef } from "@vueuse/core"
+
 export type LANGUAGE = "c" | "cpp" | "python" | "java"
 
 export interface Code {
   value: string
   language: LANGUAGE
 }
+
+export interface Cache {
+  language: RemovableRef<LANGUAGE>
+  input: RemovableRef<string>
+  code: { [key in LANGUAGE]: RemovableRef<string> }
+}