From bb70ae2200534a24133500dc95d9e161ba243797 Mon Sep 17 00:00:00 2001 From: yuetsh <517252939@qq.com> Date: Sat, 7 Jan 2023 15:29:47 +0800 Subject: [PATCH] add breakpoints. --- components.d.ts | 1 + package-lock.json | 45 +++++++------- package.json | 1 + src/App.vue | 1 - src/main.ts | 1 - src/oj/problem/components/editor.vue | 15 ++++- src/oj/problem/components/problem-content.vue | 58 +++++++++--------- src/oj/problem/components/problem-info.vue | 16 +++-- src/oj/problem/detail.vue | 21 ++++--- src/oj/problem/list.vue | 59 ++++++------------- src/utils/breakpoints.ts | 6 ++ src/utils/constants.ts | 19 ------ src/utils/functions.ts | 20 +++++++ 13 files changed, 136 insertions(+), 127 deletions(-) create mode 100644 src/utils/breakpoints.ts diff --git a/components.d.ts b/components.d.ts index 234caf5..193e614 100644 --- a/components.d.ts +++ b/components.d.ts @@ -42,5 +42,6 @@ declare module '@vue/runtime-core' { IEpSemiSelect: typeof import('~icons/ep/semi-select')['default'] RouterLink: typeof import('vue-router')['RouterLink'] RouterView: typeof import('vue-router')['RouterView'] + UseNetwork: typeof import('@vueuse/components')['UseNetwork'] } } diff --git a/package-lock.json b/package-lock.json index 63b8242..2e4351b 100644 --- a/package-lock.json +++ b/package-lock.json @@ -10,6 +10,7 @@ "dependencies": { "@element-plus/icons-vue": "^2.0.10", "@monaco-editor/loader": "^1.3.2", + "@vueuse/core": "^9.10.0", "axios": "^1.2.2", "element-plus": "^2.2.28", "normalize.css": "^8.0.1", @@ -745,13 +746,13 @@ "integrity": "sha512-Ewzq5Yhimg7pSztDV+RH1UDKBzmtqieXQlpTVm2AwraoRL/Rks96mvd8Vgi7Lj+h+TH8dv7mXD3FRZR3TUvbSg==" }, "node_modules/@vueuse/core": { - "version": "9.9.0", - "resolved": "https://registry.npmmirror.com/@vueuse/core/-/core-9.9.0.tgz", - "integrity": "sha512-JdDb7TrE0imZnwBhMF4+0PCJqGD3AxzH8S2sfk54P0rqvklK+EAtAR/mPb1HwV/JPujQFQJhghQ190Yq03YpVw==", + "version": "9.10.0", + "resolved": "https://registry.npmmirror.com/@vueuse/core/-/core-9.10.0.tgz", + "integrity": "sha512-CxMewME07qeuzuT/AOIQGv0EhhDoojniqU6pC3F8m5VC76L47UT18DcX88kWlP3I7d3qMJ4u/PD8iSRsy3bmNA==", "dependencies": { "@types/web-bluetooth": "^0.0.16", - "@vueuse/metadata": "9.9.0", - "@vueuse/shared": "9.9.0", + "@vueuse/metadata": "9.10.0", + "@vueuse/shared": "9.10.0", "vue-demi": "*" } }, @@ -778,14 +779,14 @@ } }, "node_modules/@vueuse/metadata": { - "version": "9.9.0", - "resolved": "https://registry.npmmirror.com/@vueuse/metadata/-/metadata-9.9.0.tgz", - "integrity": "sha512-pgxsUJv/d7IjKpLeB6TthggEsaBwM3ffc5jPrr5TmxAm/fup0mGR5VTzrdA/PSx85tpb+CIvP92D+55qBNc8ag==" + "version": "9.10.0", + "resolved": "https://registry.npmmirror.com/@vueuse/metadata/-/metadata-9.10.0.tgz", + "integrity": "sha512-G5VZhgTCapzU9rv0Iq2HBrVOSGzOKb+OE668NxhXNcTjUjwYxULkEhAw70FtRLMZc+hxcFAzDZlKYA0xcwNMuw==" }, "node_modules/@vueuse/shared": { - "version": "9.9.0", - "resolved": "https://registry.npmmirror.com/@vueuse/shared/-/shared-9.9.0.tgz", - "integrity": "sha512-+D0XFwHG0T+uaIbCSlROBwm1wzs71B7n3KyDOxnvfEMMHDOzl09rYKwaE2AENmYwYPXfHPbSBRDD2gBVHbvTcg==", + "version": "9.10.0", + "resolved": "https://registry.npmmirror.com/@vueuse/shared/-/shared-9.10.0.tgz", + "integrity": "sha512-vakHJ2ZRklAzqmcVBL38RS7BxdBA4+5poG9NsSyqJxrt9kz0zX3P5CXMy0Hm6LFbZXUgvKdqAS3pUH1zX/5qTQ==", "dependencies": { "vue-demi": "*" } @@ -2620,13 +2621,13 @@ "integrity": "sha512-Ewzq5Yhimg7pSztDV+RH1UDKBzmtqieXQlpTVm2AwraoRL/Rks96mvd8Vgi7Lj+h+TH8dv7mXD3FRZR3TUvbSg==" }, "@vueuse/core": { - "version": "9.9.0", - "resolved": "https://registry.npmmirror.com/@vueuse/core/-/core-9.9.0.tgz", - "integrity": "sha512-JdDb7TrE0imZnwBhMF4+0PCJqGD3AxzH8S2sfk54P0rqvklK+EAtAR/mPb1HwV/JPujQFQJhghQ190Yq03YpVw==", + "version": "9.10.0", + "resolved": "https://registry.npmmirror.com/@vueuse/core/-/core-9.10.0.tgz", + "integrity": "sha512-CxMewME07qeuzuT/AOIQGv0EhhDoojniqU6pC3F8m5VC76L47UT18DcX88kWlP3I7d3qMJ4u/PD8iSRsy3bmNA==", "requires": { "@types/web-bluetooth": "^0.0.16", - "@vueuse/metadata": "9.9.0", - "@vueuse/shared": "9.9.0", + "@vueuse/metadata": "9.10.0", + "@vueuse/shared": "9.10.0", "vue-demi": "*" }, "dependencies": { @@ -2639,14 +2640,14 @@ } }, "@vueuse/metadata": { - "version": "9.9.0", - "resolved": "https://registry.npmmirror.com/@vueuse/metadata/-/metadata-9.9.0.tgz", - "integrity": "sha512-pgxsUJv/d7IjKpLeB6TthggEsaBwM3ffc5jPrr5TmxAm/fup0mGR5VTzrdA/PSx85tpb+CIvP92D+55qBNc8ag==" + "version": "9.10.0", + "resolved": "https://registry.npmmirror.com/@vueuse/metadata/-/metadata-9.10.0.tgz", + "integrity": "sha512-G5VZhgTCapzU9rv0Iq2HBrVOSGzOKb+OE668NxhXNcTjUjwYxULkEhAw70FtRLMZc+hxcFAzDZlKYA0xcwNMuw==" }, "@vueuse/shared": { - "version": "9.9.0", - "resolved": "https://registry.npmmirror.com/@vueuse/shared/-/shared-9.9.0.tgz", - "integrity": "sha512-+D0XFwHG0T+uaIbCSlROBwm1wzs71B7n3KyDOxnvfEMMHDOzl09rYKwaE2AENmYwYPXfHPbSBRDD2gBVHbvTcg==", + "version": "9.10.0", + "resolved": "https://registry.npmmirror.com/@vueuse/shared/-/shared-9.10.0.tgz", + "integrity": "sha512-vakHJ2ZRklAzqmcVBL38RS7BxdBA4+5poG9NsSyqJxrt9kz0zX3P5CXMy0Hm6LFbZXUgvKdqAS3pUH1zX/5qTQ==", "requires": { "vue-demi": "*" }, diff --git a/package.json b/package.json index 6377b2b..9ef762a 100644 --- a/package.json +++ b/package.json @@ -12,6 +12,7 @@ "dependencies": { "@element-plus/icons-vue": "^2.0.10", "@monaco-editor/loader": "^1.3.2", + "@vueuse/core": "^9.10.0", "axios": "^1.2.2", "element-plus": "^2.2.28", "normalize.css": "^8.0.1", diff --git a/src/App.vue b/src/App.vue index 1e743db..742bf3f 100644 --- a/src/App.vue +++ b/src/App.vue @@ -1,6 +1,5 @@ diff --git a/src/main.ts b/src/main.ts index 8ad9ea6..a1c46e4 100644 --- a/src/main.ts +++ b/src/main.ts @@ -2,7 +2,6 @@ import { createApp } from "vue" import { createRouter, createWebHistory } from "vue-router" import { createPinia } from "pinia" import "normalize.css" -import "element-plus/theme-chalk/display.css" import loader from "@monaco-editor/loader" import App from "./App.vue" diff --git a/src/oj/problem/components/editor.vue b/src/oj/problem/components/editor.vue index 75b3d37..2f760c1 100644 --- a/src/oj/problem/components/editor.vue +++ b/src/oj/problem/components/editor.vue @@ -7,6 +7,7 @@ import { LANGUAGE_VALUE, SOURCES, } from "../../../utils/constants" +import { isDesktop } from "../../../utils/breakpoints" const { problem } = defineProps<{ problem: { @@ -61,11 +62,13 @@ async function init() { monaco.editor.create(monacoEditorRef.value, { value: state.values[state.language], // 编辑器初始显示文字 language: LANGUAGE_VALUE[state.language], - automaticLayout: true, // 自适应布局 theme: "vs", // 官方自带三种主题vs, hc-black, or vs-dark minimap: { enabled: false, }, + lineNumbersMinChars: 3, + automaticLayout: true, // 自适应布局 + tabSize: 4, fontSize: 24, // 字体大小 scrollBeyondLastLine: false, // 取消代码后面一大段空白 }) @@ -92,7 +95,10 @@ async function init() { 重置 -
+
1 2 @@ -113,6 +119,11 @@ async function init() { .editor { height: 70%; } + +.editorMobile { + height: 500px; +} + .actions { margin-top: 16px; float: right; diff --git a/src/oj/problem/components/problem-content.vue b/src/oj/problem/components/problem-content.vue index 7e5fa81..518c158 100644 --- a/src/oj/problem/components/problem-content.vue +++ b/src/oj/problem/components/problem-content.vue @@ -3,41 +3,39 @@ const { problem } = defineProps(["problem"])