xuyue/webpreview
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

update

Browse Source
This commit is contained in:
yuetsh
2025-03-03 13:47:34 +08:00
parent 586727cb99
commit f01f8a174d
16 changed files with 212 additions and 133 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
components.d.ts vendored
View File

@@ -14,10 +14,12 @@ declare module 'vue' {
NAlert: typeof import('naive-ui')['NAlert']
NButton: typeof import('naive-ui')['NButton']
NConfigProvider: typeof import('naive-ui')['NConfigProvider']
NDropdown: typeof import('naive-ui')['NDropdown']
NFlex: typeof import('naive-ui')['NFlex']
NForm: typeof import('naive-ui')['NForm']
NFormItem: typeof import('naive-ui')['NFormItem']
NInput: typeof import('naive-ui')['NInput']
NMessageProvider: typeof import('naive-ui')['NMessageProvider']
NModal: typeof import('naive-ui')['NModal']
NModalProvider: typeof import('naive-ui')['NModalProvider']
NSplit: typeof import('naive-ui')['NSplit']

143
package-lock.json generated
View File

@@ -1,12 +1,12 @@
{
"name": "webpreview",
"version": "0.1.0",
"name": "web",
"version": "0.2.0",
"lockfileVersion": 3,
"requires": true,
"packages": {
"": {
"name": "webpreview",
"version": "0.1.0",
"name": "web",
"version": "0.2.0",
"dependencies": {
"@codemirror/lang-css": "^6.3.1",
"@codemirror/lang-html": "^6.4.9",
@@ -29,12 +29,12 @@
},
"devDependencies": {
"@iconify/vue": "^4.3.0",
"@rsbuild/core": "^1.2.11",
"@rsbuild/core": "^1.2.14",
"@rsbuild/plugin-vue": "^1.0.6",
"@vue/tsconfig": "^0.7.0",
"prettier": "^3.5.2",
"typescript": "^5.7.3",
"unplugin-vue-components": "^28.4.0"
"prettier": "^3.5.3",
"typescript": "^5.8.2",
"unplugin-vue-components": "^28.4.1"
}
},
"node_modules/@babel/helper-string-parser": {
@@ -450,16 +450,17 @@
}
},
"node_modules/@rsbuild/core": {
"version": "1.2.11",
"resolved": "https://registry.npmjs.org/@rsbuild/core/-/core-1.2.11.tgz",
"integrity": "sha512-bsTtXlqJKoqnHwOZ05NePGpBf/neuwHTzJtQegQ9GA8YLyjow1wn8vPXFiRtYL0UqASEDtFtAm2bcaieg7r/TQ==",
"version": "1.2.14",
"resolved": "https://registry.npmjs.org/@rsbuild/core/-/core-1.2.14.tgz",
"integrity": "sha512-G8AqvCHBhs8Yt7pOQuS5YYjdYozp436ohaLr1iAMB/Jw01VNFh4u1tpShudRnw3NPmHhJ82wBaEu1zNaJ0VsKg==",
"dev": true,
"license": "MIT",
"dependencies": {
"@rspack/core": "1.2.3",
"@rspack/core": "1.2.5",
"@rspack/lite-tapable": "~1.0.1",
"@swc/helpers": "^0.5.15",
"core-js": "~3.40.0"
"core-js": "~3.40.0",
"jiti": "^2.4.2"
},
"bin": {
"rsbuild": "bin/rsbuild.js"
@@ -483,27 +484,27 @@
}
},
"node_modules/@rspack/binding": {
"version": "1.2.3",
"resolved": "https://registry.npmjs.org/@rspack/binding/-/binding-1.2.3.tgz",
"integrity": "sha512-enpOXZPQOJO800wdWcR7H5Dx5UZfwkaT0D0xsHD53WbpI09Z2KJbLX7I/i1FLLy3K1KQTB+2FIHLVdRikasXZA==",
"version": "1.2.5",
"resolved": "https://registry.npmjs.org/@rspack/binding/-/binding-1.2.5.tgz",
"integrity": "sha512-q9vQmGDFZyFVMULwOFL7488WNSgn4ue94R/njDLMMIPF4K0oEJP2QT02elfG4KVGv2CbP63D7vEFN4ZNreo/Rw==",
"dev": true,
"license": "MIT",
"optionalDependencies": {
"@rspack/binding-darwin-arm64": "1.2.3",
"@rspack/binding-darwin-x64": "1.2.3",
"@rspack/binding-linux-arm64-gnu": "1.2.3",
"@rspack/binding-linux-arm64-musl": "1.2.3",
"@rspack/binding-linux-x64-gnu": "1.2.3",
"@rspack/binding-linux-x64-musl": "1.2.3",
"@rspack/binding-win32-arm64-msvc": "1.2.3",
"@rspack/binding-win32-ia32-msvc": "1.2.3",
"@rspack/binding-win32-x64-msvc": "1.2.3"
"@rspack/binding-darwin-arm64": "1.2.5",
"@rspack/binding-darwin-x64": "1.2.5",
"@rspack/binding-linux-arm64-gnu": "1.2.5",
"@rspack/binding-linux-arm64-musl": "1.2.5",
"@rspack/binding-linux-x64-gnu": "1.2.5",
"@rspack/binding-linux-x64-musl": "1.2.5",
"@rspack/binding-win32-arm64-msvc": "1.2.5",
"@rspack/binding-win32-ia32-msvc": "1.2.5",
"@rspack/binding-win32-x64-msvc": "1.2.5"
}
},
"node_modules/@rspack/binding-darwin-arm64": {
"version": "1.2.3",
"resolved": "https://registry.npmjs.org/@rspack/binding-darwin-arm64/-/binding-darwin-arm64-1.2.3.tgz",
"integrity": "sha512-xuwYzhPgNCr4BtKXCU3xe4249TFsXAZglIlbxv8Qs3PeIarrZMRddcqH2zUXi+nJavNw3yN12sCYEzk1f+O4FQ==",
"version": "1.2.5",
"resolved": "https://registry.npmjs.org/@rspack/binding-darwin-arm64/-/binding-darwin-arm64-1.2.5.tgz",
"integrity": "sha512-ou0NXMLp6RxY9Bx8P9lA8ArVjz/WAI/gSu5kKrdKKtMs6WKutl4vvP9A4HHZnISd9Tn00dlvDwNeNSUR7fjoDQ==",
"cpu": [
"arm64"
],
@@ -515,9 +516,9 @@
]
},
"node_modules/@rspack/binding-darwin-x64": {
"version": "1.2.3",
"resolved": "https://registry.npmjs.org/@rspack/binding-darwin-x64/-/binding-darwin-x64-1.2.3.tgz",
"integrity": "sha512-afiIN8elcrO2EtO27UN0qyZqu5FXGUdclud56DrhvEfnWS3GGxJEdjA8XUYVXkfCYakdXHucIJKlkkgaAjEvHg==",
"version": "1.2.5",
"resolved": "https://registry.npmjs.org/@rspack/binding-darwin-x64/-/binding-darwin-x64-1.2.5.tgz",
"integrity": "sha512-RdvH9YongQlDE9+T2Xh5D2+dyiLHx2Gz38Af1uObyBRNWjF1qbuR51hOas0f2NFUdyA03j1+HWZCbE7yZrmI3w==",
"cpu": [
"x64"
],
@@ -529,9 +530,9 @@
]
},
"node_modules/@rspack/binding-linux-arm64-gnu": {
"version": "1.2.3",
"resolved": "https://registry.npmjs.org/@rspack/binding-linux-arm64-gnu/-/binding-linux-arm64-gnu-1.2.3.tgz",
"integrity": "sha512-K2u/fPUmKujlKSWL3q2zaUu8/6ZK/bOGKcqJSib8jdanQQ/GFKwKtPAFOOa/vvqbzhDocqKOobFR10FhgJqCHg==",
"version": "1.2.5",
"resolved": "https://registry.npmjs.org/@rspack/binding-linux-arm64-gnu/-/binding-linux-arm64-gnu-1.2.5.tgz",
"integrity": "sha512-jznk/CI/wN93fr8I1j3la/CAiGf8aG7ZHIpRBtT4CkNze0c5BcF3AaJVSBHVNQqgSv0qddxMt3SADpzV8rWZ6g==",
"cpu": [
"arm64"
],
@@ -543,9 +544,9 @@
]
},
"node_modules/@rspack/binding-linux-arm64-musl": {
"version": "1.2.3",
"resolved": "https://registry.npmjs.org/@rspack/binding-linux-arm64-musl/-/binding-linux-arm64-musl-1.2.3.tgz",
"integrity": "sha512-mgovdzGb6cH9hQsjTyzDbfZWCPhTcoHcLro1P7UbiqcLPMDJp/k3Io9xV2/EJhaDA1aynIdq7XfY0fuk4+6Irw==",
"version": "1.2.5",
"resolved": "https://registry.npmjs.org/@rspack/binding-linux-arm64-musl/-/binding-linux-arm64-musl-1.2.5.tgz",
"integrity": "sha512-oYzcaJ0xjb1fWbbtPmjjPXeehExEgwJ8fEGYQ5TikB+p9oCLkAghnNjsz9evUhgjByxi+NTZ1YmUNwxRuQDY1Q==",
"cpu": [
"arm64"
],
@@ -557,9 +558,9 @@
]
},
"node_modules/@rspack/binding-linux-x64-gnu": {
"version": "1.2.3",
"resolved": "https://registry.npmjs.org/@rspack/binding-linux-x64-gnu/-/binding-linux-x64-gnu-1.2.3.tgz",
"integrity": "sha512-542lwJzB1RMGuVdBdA3cOWTlmL9okpOppHUBWcNCjmJM+9zTI+0jwjVe8HaqOqtuR8XzNsoCwT9QonU/GLcuhg==",
"version": "1.2.5",
"resolved": "https://registry.npmjs.org/@rspack/binding-linux-x64-gnu/-/binding-linux-x64-gnu-1.2.5.tgz",
"integrity": "sha512-dzEKs8oi86Vi+TFRCPpgmfF5ANL0VmlZN45e1An7HipeI2C5B1xrz/H8V43vPy8XEvQuMmkXO6Sp82A0zlHvIA==",
"cpu": [
"x64"
],
@@ -571,9 +572,9 @@
]
},
"node_modules/@rspack/binding-linux-x64-musl": {
"version": "1.2.3",
"resolved": "https://registry.npmjs.org/@rspack/binding-linux-x64-musl/-/binding-linux-x64-musl-1.2.3.tgz",
"integrity": "sha512-dJromiREDcTWqzfCOI5y1IVoYmUnCv7vCp63AEq0+13fJJdk7+pcNN3VV2jOKpk9VECSvjg1c01wl+UzXAXFMw==",
"version": "1.2.5",
"resolved": "https://registry.npmjs.org/@rspack/binding-linux-x64-musl/-/binding-linux-x64-musl-1.2.5.tgz",
"integrity": "sha512-4ENeVPVSD97rRRGr6kJSm4sIPf1tKJ8vlr9hJi4sSvF7eMLWipSwIVmqRXJ2riVMRjYD2einmJ9KzI8rqQ2OwA==",
"cpu": [
"x64"
],
@@ -585,9 +586,9 @@
]
},
"node_modules/@rspack/binding-win32-arm64-msvc": {
"version": "1.2.3",
"resolved": "https://registry.npmjs.org/@rspack/binding-win32-arm64-msvc/-/binding-win32-arm64-msvc-1.2.3.tgz",
"integrity": "sha512-S8ZKddMMQDGy8jx/R0i2m1XrmfY2CpI+t6lIEpsuZuKUR4MbOGKN2DuL4MDnT3m8JaYvC8ihsvQjBXQCy3SNxQ==",
"version": "1.2.5",
"resolved": "https://registry.npmjs.org/@rspack/binding-win32-arm64-msvc/-/binding-win32-arm64-msvc-1.2.5.tgz",
"integrity": "sha512-WUoJvX/z43MWeW1JKAQIxdvqH02oLzbaGMCzIikvniZnakQovYLPH6tCYh7qD3p7uQsm+IafFddhFxTtogC3pg==",
"cpu": [
"arm64"
],
@@ -599,9 +600,9 @@
]
},
"node_modules/@rspack/binding-win32-ia32-msvc": {
"version": "1.2.3",
"resolved": "https://registry.npmjs.org/@rspack/binding-win32-ia32-msvc/-/binding-win32-ia32-msvc-1.2.3.tgz",
"integrity": "sha512-74lqSMKQJcJcgfFaxm+G9YVJSl2KK9/v4fRoMsWApztNy2qNgee+UguNBCOU6JLa3rVSj8Z5OVVDtJkGFrSvVg==",
"version": "1.2.5",
"resolved": "https://registry.npmjs.org/@rspack/binding-win32-ia32-msvc/-/binding-win32-ia32-msvc-1.2.5.tgz",
"integrity": "sha512-YzPvmt/gpiacE6aAacz4dxgEbNWwoKYPaT4WYy/oITobnAui++iCFXC4IICSmlpoA1y7O8K3Qb9jbaB/lLhbwA==",
"cpu": [
"ia32"
],
@@ -613,9 +614,9 @@
]
},
"node_modules/@rspack/binding-win32-x64-msvc": {
"version": "1.2.3",
"resolved": "https://registry.npmjs.org/@rspack/binding-win32-x64-msvc/-/binding-win32-x64-msvc-1.2.3.tgz",
"integrity": "sha512-fcU532PgFdd5Bil8jwQW0Dcb/80oM6V0qSstGIxZ4M77t4t8e/PcukXfORTL71FfNQ64Rd4Dp6XRl1NHNJVxeg==",
"version": "1.2.5",
"resolved": "https://registry.npmjs.org/@rspack/binding-win32-x64-msvc/-/binding-win32-x64-msvc-1.2.5.tgz",
"integrity": "sha512-QDDshfteMZiglllm7WUh/ITemFNuexwn1Yul7cHBFGQu6HqtqKNAR0kGR8J3e15MPMlinSaygVpfRE4A0KPmjQ==",
"cpu": [
"x64"
],
@@ -627,14 +628,14 @@
]
},
"node_modules/@rspack/core": {
"version": "1.2.3",
"resolved": "https://registry.npmjs.org/@rspack/core/-/core-1.2.3.tgz",
"integrity": "sha512-BFgdUYf05/hjjY9Nlwq8DpWaRJN5w2kTl8ZJi20SRL60oAx+ZD2ABT+fsPhBiFSmfTZDdvGGIq5e3vfRzoIuqg==",
"version": "1.2.5",
"resolved": "https://registry.npmjs.org/@rspack/core/-/core-1.2.5.tgz",
"integrity": "sha512-x/riOl05gOVGgGQFimBqS5i8XbUpBxPIKUC+tDX4hmNNkzxRaGpspZfNtcL+1HBMyYuoM6fOWGyCp2R290Uy6g==",
"dev": true,
"license": "MIT",
"dependencies": {
"@module-federation/runtime-tools": "0.8.4",
"@rspack/binding": "1.2.3",
"@rspack/binding": "1.2.5",
"@rspack/lite-tapable": "1.0.1",
"caniuse-lite": "^1.0.30001616"
},
@@ -2047,6 +2048,16 @@
"url": "https://github.com/chalk/supports-color?sponsor=1"
}
},
"node_modules/jiti": {
"version": "2.4.2",
"resolved": "https://registry.npmjs.org/jiti/-/jiti-2.4.2.tgz",
"integrity": "sha512-rg9zJN+G4n2nfJl5MW3BMygZX56zKPNVEYYqq7adpmMh4Jn2QNEwhvQlFy6jPVdcod7txZtKHWnyZiA3a0zP7A==",
"dev": true,
"license": "MIT",
"bin": {
"jiti": "lib/jiti-cli.mjs"
}
},
"node_modules/json-loose": {
"version": "1.2.4",
"resolved": "https://registry.npmjs.org/json-loose/-/json-loose-1.2.4.tgz",
@@ -2368,9 +2379,9 @@
}
},
"node_modules/prettier": {
"version": "3.5.2",
"resolved": "https://registry.npmjs.org/prettier/-/prettier-3.5.2.tgz",
"integrity": "sha512-lc6npv5PH7hVqozBR7lkBNOGXV9vMwROAPlumdBkX0wTbbzPu/U1hk5yL8p2pt4Xoc+2mkT8t/sow2YrV/M5qg==",
"version": "3.5.3",
"resolved": "https://registry.npmjs.org/prettier/-/prettier-3.5.3.tgz",
"integrity": "sha512-QQtaxnoDJeAkDvDKWCLiwIXkTgRhwYDEQCghU9Z6q03iyek/rxRh/2lC3HB7P8sWT2xC/y5JDctPLBIGzHKbhw==",
"dev": true,
"license": "MIT",
"bin": {
@@ -2649,9 +2660,9 @@
"license": "0BSD"
},
"node_modules/typescript": {
"version": "5.7.3",
"resolved": "https://registry.npmjs.org/typescript/-/typescript-5.7.3.tgz",
"integrity": "sha512-84MVSjMEHP+FQRPy3pX9sTVV/INIex71s9TL2Gm5FG/WG1SqXeKyZ0k7/blY/4FdOzI12CBy1vGc4og/eus0fw==",
"version": "5.8.2",
"resolved": "https://registry.npmjs.org/typescript/-/typescript-5.8.2.tgz",
"integrity": "sha512-aJn6wq13/afZp/jT9QZmwEjDqqvSGp1VT5GVg+f/t6/oVyrgXM6BY1h9BRh/O5p3PlUPAe+WuiEZOmb/49RqoQ==",
"devOptional": true,
"license": "Apache-2.0",
"bin": {
@@ -2708,9 +2719,9 @@
}
},
"node_modules/unplugin-vue-components": {
"version": "28.4.0",
"resolved": "https://registry.npmjs.org/unplugin-vue-components/-/unplugin-vue-components-28.4.0.tgz",
"integrity": "sha512-fnamX2RiKM30nPK4tihEas+bHnbLICo6MmOiP4jGg7fAlgNEuaLvN9yx96JwZDOYfLQcrNzikDdPhZ8k6pkhMg==",
"version": "28.4.1",
"resolved": "https://registry.npmjs.org/unplugin-vue-components/-/unplugin-vue-components-28.4.1.tgz",
"integrity": "sha512-niGSc0vJD9ueAnsqcfAldmtpkppZ09B6p2G1dL7X5S8KPdgbk1P+txPwaaDCe7N+eZh2VG1aAypLXkuJs3OSUg==",
"dev": true,
"license": "MIT",
"dependencies": {
@@ -2719,7 +2730,7 @@
"local-pkg": "^1.0.0",
"magic-string": "^0.30.17",
"mlly": "^1.7.4",
"tinyglobby": "^0.2.10",
"tinyglobby": "^0.2.12",
"unplugin": "^2.2.0",
"unplugin-utils": "^0.2.4"
},

12
package.json
View File

@@ -1,7 +1,7 @@
{
"name": "webpreview",
"name": "web",
"private": true,
"version": "0.1.0",
"version": "0.2.0",
"type": "module",
"scripts": {
"start": "rsbuild dev",
@@ -30,11 +30,11 @@
},
"devDependencies": {
"@iconify/vue": "^4.3.0",
"@rsbuild/core": "^1.2.11",
"@rsbuild/core": "^1.2.14",
"@rsbuild/plugin-vue": "^1.0.6",
"@vue/tsconfig": "^0.7.0",
"prettier": "^3.5.2",
"typescript": "^5.7.3",
"unplugin-vue-components": "^28.4.0"
"prettier": "^3.5.3",
"typescript": "^5.8.2",
"unplugin-vue-components": "^28.4.1"
}
}

29
src/App.vue
View File

@@ -1,30 +1,15 @@
<script setup lang="ts">
import { dateZhCN, zhCN } from "naive-ui"
import { useMagicKeys, whenever } from "@vueuse/core"
import Login from "./components/Login.vue"
import { onMounted, watch } from "vue"
import { getMyProfile } from "./api"
import { authed, username } from "./store/user"
const { ctrl_s } = useMagicKeys({
passive: false,
onEventFired(e) {
if (e.ctrlKey && e.key === "s" && e.type === "keydown") e.preventDefault()
},
})
const { ctrl_r } = useMagicKeys({
passive: false,
onEventFired(e) {
if (e.ctrlKey && e.key === "r" && e.type === "keydown") e.preventDefault()
},
})
whenever(ctrl_s, () => {})
whenever(ctrl_r, () => {})
import { authed, user } from "./store/user"
onMounted(async () => {
const data = await getMyProfile()
username.value = data
user.loaded = true
user.username = data.username
user.role = data.role
})
watch(authed, (v) => {
@@ -39,8 +24,10 @@ watch(authed, (v) => {
<template>
<n-config-provider class="myContainer" :locale="zhCN" :date-locale="dateZhCN">
<n-modal-provider>
<router-view></router-view>
<Login />
<n-message-provider>
<router-view></router-view>
<Login />
</n-message-provider>
</n-modal-provider>
</n-config-provider>
</template>

61
src/components/Editors.vue
View File

@@ -68,11 +68,20 @@
</n-tab-pane>
<template #suffix>
<n-flex align="center" class="suffix">
<span>{{ username }}</span>
<n-button v-if="!authed" @click="handleLogin" secondary type="primary">
<template v-if="user.loaded && authed">
<n-button type="primary" secondary @click="submit">提交</n-button>
<n-dropdown :options="menu" @select="clickMenu">
<n-button>{{ user.username }}</n-button>
</n-dropdown>
</template>
<n-button
v-if="user.loaded && !authed"
@click="handleLogin"
secondary
type="primary"
>
登录
</n-button>
<n-button v-else @click="handleLogout">退出</n-button>
</n-flex>
</template>
</n-tabs>
@@ -81,9 +90,46 @@
import { Icon } from "@iconify/vue"
import Editor from "./Editor.vue"
import { html, css, js, tab, size, reset } from "../store/editors"
import { username, authed } from "../store/user"
import { user, authed, roleNormal } from "../store/user"
import { loginModal } from "../store/modal"
import { logout } from "../api"
import { Role } from "../utils/type"
import { router } from "../router"
import { computed, h } from "vue"
import { useMessage } from "naive-ui"
const message = useMessage()
const menu = computed(() => [
{
label: "后台",
key: "dashboard",
show: !roleNormal.value,
icon: () =>
h(Icon, {
icon: "streamline-emojis:robot-face-1",
}),
},
{
label: "退出",
key: "logout",
icon: () =>
h(Icon, {
icon: "streamline-emojis:hot-beverage-2",
}),
},
])
function clickMenu(name: string) {
switch (name) {
case "dashboard":
router.push({ name: "dashboard" })
break
case "logout":
handleLogout()
break
}
}
function changeTab(name: string) {
tab.value = name
@@ -99,7 +145,12 @@ function handleLogin() {
async function handleLogout() {
await logout()
username.value = ""
user.username = ""
user.role = Role.Normal
}
function submit() {
message.error("未实装")
}
</script>
<style scoped>

6
src/components/Login.vue
View File

@@ -32,7 +32,7 @@
import { ref } from "vue"
import { login } from "../api"
import { loginModal } from "../store/modal"
import { username } from "../store/user"
import { user } from "../store/user"
const name = ref("")
const password = ref("")
@@ -42,7 +42,9 @@ const showMeesage = ref(false)
async function submit() {
try {
const data = await login(name.value, password.value)
username.value = data
user.username = data.username
user.role = data.role
user.loaded = true
loginModal.value = false
} catch (err) {
showMeesage.value = true

3
src/components/Preview.vue
View File

@@ -4,9 +4,6 @@
<Icon icon="noto:eyes" :width="20"></Icon>
<n-text class="titleText">预览</n-text>
</n-flex>
<n-flex>
<!-- <n-button>提交</n-button> -->
</n-flex>
</n-flex>
<iframe class="iframe" ref="iframe"></iframe>
</template>

2
src/main.ts
View File

@@ -11,7 +11,7 @@ import { marked } from "marked"
import alert from "marked-alert"
import { markedHighlight } from "marked-highlight"
import preview from "marked-code-preview"
import { alertVariants } from "./utils"
import { alertVariants } from "./utils/const"
import hljs from "highlight.js/lib/core"
import xml from "highlight.js/lib/languages/xml"

1
src/pages/Admin.vue
View File

@@ -1 +0,0 @@
<template>秘密花园</template>

1
src/pages/Dashboard.vue Normal file
View File

@@ -0,0 +1 @@
<template>秘密花园</template>

49
src/pages/Home.vue
View File

@@ -1,22 +1,39 @@
<template>
<n-split :default-size="1 / 3" min="300px" max="800px">
<template #1>
<Tutorial />
</template>
<template #2>
<n-split direction="vertical" min="200px">
<template #1>
<Editors />
</template>
<template #2>
<Preview />
</template>
</n-split>
</template>
</n-split>
<n-split :default-size="1 / 3" min="300px" max="800px">
<template #1>
<Tutorial />
</template>
<template #2>
<n-split direction="vertical" min="200px">
<template #1>
<Editors />
</template>
<template #2>
<Preview />
</template>
</n-split>
</template>
</n-split>
</template>
<script lang="ts" setup>
import { useMagicKeys, whenever } from "@vueuse/core"
import Editors from "../components/Editors.vue"
import Preview from "../components/Preview.vue"
import Tutorial from "../components/Tutorial.vue"
</script>
const { ctrl_s } = useMagicKeys({
passive: false,
onEventFired(e) {
if (e.ctrlKey && e.key === "s" && e.type === "keydown") e.preventDefault()
},
})
const { ctrl_r } = useMagicKeys({
passive: false,
onEventFired(e) {
if (e.ctrlKey && e.key === "r" && e.type === "keydown") e.preventDefault()
},
})
whenever(ctrl_s, () => {})
whenever(ctrl_r, () => {})
</script>

13
src/router.ts
View File

@@ -2,15 +2,14 @@ import { createWebHistory, createRouter } from "vue-router"
import { loginModal } from "./store/modal"
import Home from "./pages/Home.vue"
import Protected from "./pages/Protected.vue"
const routes = [
{ path: "/", component: Home },
{
path: "/protected",
name: "protected",
component: Protected,
meta: { requiresAuth: true },
path: "/dashboard",
name: "dashboard",
component: () => import("./pages/Dashboard.vue"),
meta: { auth: true },
},
]
@@ -21,10 +20,10 @@ export const router = createRouter({
router.beforeEach((to, from, next) => {
const isLoggedIn = localStorage.getItem("web-isloggedin") === "true"
if (to.meta.requiresAuth && !isLoggedIn) {
if (to.meta.auth && !isLoggedIn) {
loginModal.value = true
next(false)
} else {
next() // 允许访问
next()
}
})

4
src/store/modal.ts
View File

@@ -1,3 +1,3 @@
import { ref } from "vue";
import { ref } from "vue"
export const loginModal = ref(false)
export const loginModal = ref(false)

14
src/store/user.ts
View File

@@ -1,4 +1,12 @@
import { computed, ref } from "vue"
import { computed, reactive } from "vue"
import { Role } from "../utils/type"
export const username = ref("")
export const authed = computed(() => !!username.value)
export const user = reactive({
loaded: false,
username: "",
role: Role.Normal,
})
export const authed = computed(() => !!user.username)
export const roleNormal = computed(() => user.role === Role.Normal)
export const roleAdmin = computed(() => user.role === Role.Admin)
export const roleSuper = computed(() => user.role !== Role.Super)

0
src/utils.ts → src/utils/const.ts
View File

5
src/utils/type.ts Normal file
View File

@@ -0,0 +1,5 @@
export enum Role {
Super = "super",
Admin = "admin",
Normal = "normal",
}